ネットアンサー55備忘録

map

const GoalCard = (props) => {

  return (
    <ul>
      {cards.map((card) => (
        <li>{card.name}、{card.age}、{card.gender}</li>
      ))}
    </ul>
  );
}

const TodoList = ({ todos, toggleTodo }) => {

  return (
    <ul>
          {todos.map((todo,index) => (
              <Todo todo={todo} toggleTodo={toggleTodo} index = {index} key={todo.id} />
          ))}
    </ul>
  )
}

filter

一致したものだけ配列として作成する。

const newTodos = todos.filter((todo) => !todo.completed);

find

見つかったtodoはnewTodosの中の一致したものを参照している。

    const newTodos = [...todos];
    const todo = newTodos.find((todo) => todo.id === id);