computed计算属性值是函数的监控的数据

2021-10-08 14:11:34 浏览数 (1)

  • computed 监控的数据在 data 中没有声明
  • computed 不支持异步,当 computed 中有异步操作时,无法监听数据的变化
  • computed 具有缓存,页面重新渲染,值不变时,会直接返回之前的计算结果,不会重新计算
  • 如果一个属性是由其他属性计算而来的,这个属性依赖其他属性,一般使用 computed
  • computed 计算属性值是函数时,默认使用get方法。如果属性值是属性值时,属性有一个get和set方法,当数据发生变化时会调用set方法。

代码语言:javascript复制
computed:{
 //属性值为函数
 perName:function(){
  return this.per.name
 },
 //属性值为属性值
 full:{
  get(){  },
  set(val){  }
 }
},

3.2、对于 watch

  • 监测的数据必须在 data 中声明或 props 中数据
  • 支持异步操作
  • 没有缓存,页面重新渲染时,值不改变时也会执行
  • 当一个属性值发生变化时,就需要执行相应的操作
  • 监听数据发生变化时,会触发其他操作,函数有两个参数:
代码语言:javascript复制
immediate :组件加载立即触发回调函数
deep:深度监听,主要针对复杂数据,如监听对象时,添加深度监听,任意的属性值改变都会触发。
注意:对象添加深度监听之后,输出的新旧值是一样的。

computed 页面重新渲染时,不会重复计算,而 watch 会重新计算,所以 computed 性能更高些。

0 人点赞