-
用于更快的更新虚拟dom
在vue中,为了优化运行效率,vue使用了作为对象存在的虚拟dom.
key值作为虚拟dom的识别符号存在用来更快的更新虚拟dom
当存在key值,在视图更新时diff算法会更快的识别没有改变的元素 用以就地复用
不存在key值时,diff算法会从头开始遍历识别没有改变的元素,当发现第一个改变的元素之后,其后面的所有元素都会重新渲染
-
用于标记动态路由,防止改变params时就地复用导致的部分生命周期函数无法触发的问题
在使用动态路由的时候,因为vue的就地复用的机制导致vue不能完整的区分他们的不同,
使得本来应该在初始化触发的cereated,monted等生命周期函数无法触发.
添加key值后,vue能够正确的识别对应的params并且保留已经打开过的动态路由的数据并不会进入销毁阶段,也能够触发所有的生命周期函数.
-
用于标记v-if和v-else,使得vue能够识别,防止在切换时触发就地复用
因为v-if切换标签时,多个相同的标签被渲染,如果不添加key来区分则会出现复用的情况。
-
用于标记v-for,在重复渲染时方便就地复用,提升效率
在v-for遍历时,通常添加key值用于维护和可预测内部组件以及子类的状态,在重复渲染时触发就地复用以提高效率