Vue的计算属性和监听属性简述
作者:互联网
-
Computed(计算属性)
computed是计算属性,类似于过滤器,对绑定到视图的数据进行处理,并监听变化进而执行对应的方法
computed
是计算属性,也就是计算值,多用于计算值的场景computed
具有缓存性,computed
的值在getter
执行后是会缓存的,只有在它依赖的属性值改变之后,下一次获取computed
的值才会重新调用对应的getter
来计算computed
适用于计算比较消耗性能的计算场景
-
Watch
watch是一个侦听的动作,用来观察和响应Vue实例上的数据变动
- 更多的是"观察"的作用,类似于某些数据的监听回调,用于观察
props
、$emit
或者本组件的值,当数据来回变化时来执行回调进行后续操作 - 无缓存性,页面重新渲染时值不变化也会执行
- 浅监听,引用类型拿不到
oldvalue
,需要使用handler
、deep:true
属性:handler、immediate、deep
- 更多的是"观察"的作用,类似于某些数据的监听回调,用于观察
-
小结
- 当要进行数值计算,而且依赖于其他数据,那么把这个数据设计为
computed
- 如果需要在某个数据变化时做一些事情,使用
watch
来观察这个数据变化
- 当要进行数值计算,而且依赖于其他数据,那么把这个数据设计为
标签:Vue,computed,简述,缓存,计算,数据,监听,属性 来源: https://www.cnblogs.com/shallow-dreamer/p/16538925.html