美文网首页
v-for 中key的作用

v-for 中key的作用

作者: FateOfKing | 来源:发表于2020-06-18 22:33 被阅读0次

    一句话概括: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的作用

          本文链接:https://www.haomeiwen.com/subject/xybpxktx.html