一:key是什么?
用+new Date()生成的时间戳作为key,手动强制触发重新渲染。 key是给每一个vnode的唯一id,也是diff的一种优化策略,可以根据key,更准确,更快的找到对应的vnode节点。
场景背后的逻辑
场景1:当我们在使用v-for时,需要给单元加上key。
如果不用key,vue会采用就地复用原则:最小化element的移动,并且会尝试尽最大程度在同适当的地方对相同类型的element,做patch或者reuse。
如果使用了key,Vue会根据keys的顺序记录element,曾经拥有了key的element如果不再出现的话,会被直接remove或者destroyed。
场景2:用+new Date() 当拥有新值的rerender作为key时,拥有了新key的Comp出现了,那么旧key Comp会被移除,新key Comp触发渲染。
二:设置key与不设置key区别
设置key能够大大减少对页面DOM操作,提高了diff效率。
设置key值一定能提高diff效率吗? 不一定