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

你可能感兴趣的:(v-for 中key的作用)