vue2 维护状态key的作⽤和原理

1. key定义

为了给 Vue ⼀个提示,以便它能跟踪每个节点的身份,从⽽重⽤重新排序现有元素,你需要为每项提供⼀个唯⼀ key

2. 写法

<li v-for="(item,index) in obj" :key="item.id">{{item.name}}</li>

3. 作⽤

  • key 值使⽤数组的索引index,或者不加,在数组元素顺序打乱时,会产⽣不必要的DOM更新以及界⾯效果出问题
  • key 主要⽤在 Vue 虚拟 DOM(类似 js 对象格式的数据) 的 Diff 算法新旧虚拟 DOM 对⽐复⽤不变的旧节点,渲染改变的节点,提⾼渲染速度。

你可能感兴趣的:(javascript,vue.js,前端)