vue指令

83 阅读2分钟

v-key指令的作用

1.给元素添加了唯一标识符,让vue更佳精准的渲染元素,让vue强制更新DOM

image.png

2.vue里面key为什么不能作为下标?

因为数组中的当前元素发生了变化,其他元素下标都会发生变化


真实DOM和虚拟DOM的区别

1.真实DOM,存储几百个属性

2.虚拟Dom:只能存储核心十几个属性 (虚拟Dom本质上是js对象,与真实DOM最大的区别是:虚拟Dom存储核属性,提高渲染频率)

3.虚拟DOM如何工作?

1.把页面的元素转化成虚拟DOM(Vnode)

2.当vue里面的数组发生了变化时候会使用diff算法和新旧vnode 只更新变化的部分只更新

计算属性和侦听器6个区别

1-作用不同

  1. 计算属性的作用: 解决模板语法渲染代码冗余问题(官网原话哟)

简单来说:就是如果我们渲染一个数据需要经过计算才能得到,那么就可以使用计算属性。例如:判断购物车是否全选,求累加和等经典计算场景

2-语法不同

(1)计算属性有返回值,侦听器没有返回值

(2)计算属性可以新增属性,而侦听器只能侦听data中的属性

3.缓存机制不同

计算属性有缓存机制,侦听器没有缓存机制

4.监听数量不同

  • 计算属性可以监听多个数据变化,侦听器只能监听一个数据变化

5.代码不同

  • 计算属性不支持异步操作,侦听器支持异步操作

6.初始执行时机不同

  • 计算属性在页面一加载的时候就会执行一次
  • 侦听器只有在数据第一次发生变化的时候才会执行