用 map 渲染数组时，React 要知道每一项在更新前后是否还是同一个项目。key 就是列表项的稳定标识。
使用数据本身的标识
{tasks.map((task) => (
<li key={task.id}>{task.title}</li>
))}
如果数据里有稳定且唯一的 id，优先使用它。插入、删除或重新排序后，React 就能更准确地对应列表项。
为什么通常不选数组下标
数组下标表达的是当前位置。当列表顺序变化时，同一个下标可能对应另一条数据，输入框等带状态的内容就可能跟着错位。
静态、永不改变顺序的列表用下标通常不会出问题；可变列表应尽量使用稳定标识。key 也只供 React 使用，不会作为普通 Props 传到组件里。