React中,在确保数组不变的情况下,是否有必要避免使用index作为key值?
key用于标识项目使React能识别项目的变化,减少不必要的dom改动,因此通常不建议使用不稳定的index作为key值
但如果可以确保数组内容不变的情况下,index能够稳定标识数组项,是否依然需要避免使用index作为key值呢?会带来什么问题吗?
更进一步,如果可以确保只在数组末尾增删元素,是否也可以使用index作为key值呢?
const arr = ['foo', 'bar', 'baz']; // 这个数组内容不会变化
class Comp extends React.Component {
render() {
return (
<div>
{
arr.map((value, index) => <p key={index}>{value}</p>)
}
</div>
);
}
}
2 回复
在长度固定,但是元素会变化的时候应该避免使用index作为key
key 你说的对,为了表示 DOM 唯一性,避免不必要的 DOM 修改。 只在末尾添加和删除也没有关系,都确保了唯一。 如果在数组开头添加的话,所有 kay 都+1了。