一、问题描述
给table或li设置key值时，我们一般使用后台数据的id值，而不是使用列表的下标值
二、原因
后台数据id和列表下标都是唯一不重复的，但列表下标值在列表进行删除操作时，就会有问题(前端的diff算法)。比如，现在有列表数据：
[
{
"index": 0,
"name": "A"
},
{
"index": 1,
"name": "B"
},
{
"index": 2,
"name": "C"
}
]
当删除元素B时，数据变成了：
[
{
"index": 0,
"name": "A"
},
{
"index": 1,
"name": "C"
}
]
删除前后，下标index=1的是两个值，diff算法对比会有问题，但使用id值则不会出现问题。
三、总结
- 使用id，列表删除前后，id对应的数据都是唯一的
- 使用下标，列表删除前后，下标对应的数据是不唯一的。
网友评论