vue key的作用及原理
v-for 时经常发现不写key值代码会出现警告,其实vue在推荐大家使用key
key值作用:
1:当 vue.js 用 v-for 正在更新已渲染过的元素列表时,它默认用“就地复用”策略。如果数据项的顺序被改变,vue 将不会移动 DOM 元素来匹配数据项的顺序, 而是简单复用此处每个元素,并且确保它在特定索引下显示已被渲染过的每个元素。key的作用让每个item有一个唯一的识别身份,可以下标值index或者id, 主要是为了vue精准的追踪到每一个元素,高效的更新虚拟DOM。
注意:绑定key值最好用id 标识,用索引index的话,不太友好,因为index是可变的。当数据改变时,会涉及到虚拟dom更新问题,绑定具体id, 会帮助虚拟dom更精确的做diff算法,会比较最小差异,然后进行更新视图。