向React中循环中的JSX元素添加键的不同方法
向React中循环中的JSX元素添加键的不同方法
提问于 2018-09-06 11:32:27
我已经在react上工作了一年多了。我主要使用.map、.forEach、.filter或Object.keys和Object.values迭代数组(如果数组是对象)。
但是，向jsx元素添加唯一键的不同方法有哪些呢？下面是我到现在为止所习惯的
使用数据中的唯一id作为key prop的key：
const data= [{"id": "01", "name": "abc"}, {"id": "02", "name": "xyz"}];
render(){
const items = data.map(item => {
return <span key={item.id}>{item.name}</span>;
}
return(
<div>
{items}
</div>
)
}使用index作为key prop的key：
const data= [{"id": "01", "name": "abc"}, {"id": "02", "name": "xyz"}];
render(){
const items = data.map((item, i) => {
let keyValue = i+1;
return <span key={keyValue}>{item.name}</span>;
}
return(
<div>
{items}
</div>
)
}除了我上面提到的，有没有其他方法可以向jsx元素添加唯一键，并且哪种方法是最有效和最推荐的？
回答 1
Stack Overflow用户
发布于 2018-09-14 19:50:57
在内容上使用md5 sha1，甚至sha256。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52196127
复制相关文章
相似问题