【源码】v-for中的key

[sleepyShen1989]

作用

• 用在Vue的虚拟DOM算法，在新旧nodes对比时辨识VNodes
• 解决dom删改时的某些bug

区别

• 有key，使用patchKeyedChildren方法
  1. 从头开始遍历比较，如果type或者key不同则跳出循环
  2. 从尾部开始遍历比较，如果type或者key不同则跳出循环
  3. 旧节点遍历完毕，依然有新节点，则挂载新节点 (common sequence + mount)
  4. 新节点遍历完毕，依然有旧节点，则卸载旧节点 (common sequence + unmount)
  5. 未知序列patch
• 没有key，使用patchUnKeyedChildren方法
  • 从前往后逐个patch。尽可能复用节点
  • a,b,c,d -> a,b,e,c,d
  • (a->a,b->b,c->e,d->c, add d)

Vnode优点

• 多平台
• 帮助diff算法进行性能优化