v-for 中key的作用

一句话概括:key标识了每个vnode的唯一性,在vdom改变时能精准找出变化的vnode,减少改变vdom的消耗提高执行效率。
详细说明:
vdom都是一层一层去对比的
如图

vdom.png

现在出现变化了,需要将F加入到B和C之间


change.jpg

默认的diff算法会这样执行,C更新为F,D->C,E->D....如果节点多了就要执行很多次,效率低下


default-diff.jpg

引入key后,并优化diff算法
可以直接找到位置,并且插入新vnode


better-diff.jpg
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。