警告-列表中的每个子项都应具有唯一的&q；键和道具 [英] Warning - Each child in a list should have a unique "key" prop

问题描述

收到警告：列表中的每个子项都应该具有唯一的&q；项和属性。我无法确定需要使用哪个项。

<td className="banana-td">
                    {todos.map((todo, index) => (
                        <BananaBullet
                            key={index.id}
                            value={todo.date}
                            completed={todo.completed}
                            onClick={() => 
           toggleTodo(todo.id)}
                        />
                    ))}
                </td>

                <td className="task-td">
                    {todos.map((todo, index) => (
                        <TodoContainer
                            key={index.id}
                            text={todo.text}
                            completed={todo.completed}
                            toggleTodoItem={() => 
          toggleTodo(todo.id)}
                        />
                    ))}
                </td>
                <td>
                    {todos.map((todo, index) => (
                        <DeadlineList
                            key={index.id}
                            value={todo.date}
                            completed={todo.completed}
                            onClick={() => 
                 toggleTodo(todo.id)}

我修改了react guidelines，但它不能帮助我理解如何在我的情况下使用它

推荐答案

index是数字，不是对象。只要index就够了。

key={index}

这篇关于警告-列表中的每个子项都应具有唯一的&q；键和道具的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！