Listen vor dem Rendern filtern

Snippet

Listen vor dem Rendern filtern

Du kannst die Methode filter() verwenden, um eine Teilmenge eines Arrays basierend auf einer Bedingung zu erstellen. Dies wird oft vor dem Mapping gemacht, um nur bestimmte Elemente in der Benutzeroberfläche anzuzeigen.

snippet.js
javascript
function TodoList({ todos }) {
  const pendingTodos = todos.filter(todo => !todo.completed);
 
  return (
    <ul>
      {pendingTodos.map(todo => (
        <li key={todo.id}>{todo.text}</li>
      ))}
    </ul>
  );
}

react

Erklärung

todos.filter(todo => !todo.completed)

Erstellt ein neues Array, das nur die Elemente enthält, bei denen completed falsch ist.

Vorheriges Snippet Nächstes Snippet

Mehr JavaScript-Übungen für Anfänger →

Verwandt

Aus deiner Bibliothek