这是一个创建于 903 天前的主题，其中的信息可能已经有所发展或是发生改变。
框架 vue2
摘要 列表循环渲染，列表项中的 DOM 树上挂载了视频流，由于列表数据更新导致 DOM 重新加载，于是视频没了
问题 列表增加或者删除某项，会导致整个列表 DOM 重新渲染，但是流数据是通过组件绑在列表项的某个 DOM($dom)上的，有方法让 vue 不重新渲染 $dom 节点，但是渲染其他节点吗？
 |
1
vitozyf 2022-05-16 13:22:28 +08:00
给每个节点增加唯一 key
|
 |
2
shintendo 2022-05-16 13:42:07 +08:00
本来就是只渲染修改的部分，问题在于你的列表增删了项以后，vue 无法确定新列表和旧列表的元素对应关系。
比如[1, 2, 3, 4, 5]变成[2, 3, 4, 5]，有可能是删掉了第一项，也有可能是删掉了最后一项并把前四项+1 ，vue 无从知道。 当列表元素持有状态（类似 react 的非受控组件）的时候，就会出现问题了。 解决方法如一楼所说，给元素加 key 。通过对比新列表和旧列表的 key ，vue 就能知道你增删了哪一项，从而只渲染对应的项。 注意不要给$index ，那跟没给是一样的。 |
Select Language