vue中key的作用以及原理

前端面试 专栏收录该内容
10 篇文章 0 订阅

key的作用:在diff算法执行时,更快的找到对应的节点,高效的更新虚拟dom,

key是具有唯一性的,所以在每次for循环的时候,我们需要key给每个节点做唯一的标识,唯一标识可以使item里面id index 等 然后diff算法就可以正确的识别此节点,找到正确的位置插入新的节点,

Vue 会尽可能高效地渲染元素,通常会复用已有元素而不是从头开始渲染。这么做使 Vue 变得非常快,但是这样也不总是符合实际需求。
2.2.0+ 的版本里,当在组件中使用 v-for 时,key 是必须的

原理: key的作用主要是高效的更新虚拟Dom, 其原理是vue 在patch中的patchVode下的updateChildren 会处理新老子节点 可以通过 key精准判断俩个节点是否是同一个,如果没有加key就会强应的更新,从而会有频繁的更新过程,性能会很差,加了key还会可以使整个patch 过程更加高效,减少dom 操作,提高性能

  • 4
    点赞
  • 0
    评论
  • 18
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值