vue计算属性和侦听属性
计算属性
1介绍
计算属性是自动监听依赖值得变化,从而动态返回内容,监听是一个过程。在监听的值变化时,可以触发一个回调,并做一些事情:
有以下特点:
*数据可以进行逻辑处理。减少模板中计算逻辑。
*对计算属性中的数据进行监听
*依赖固定的数据类型(响应式数据)
2计算属性vs普通属性
可以像绑定普通属相的方法一样在模板中绑定计算属性,在定义上有区别:计算属性的属性值必须是一个函数
3计算属性vs方法
computed是可以缓存的,methods不能缓存。computed只要相关依赖没有改变,多次访问计算属性得到值是之前缓存的计算结果,不会多次执行,
*计算属性可以传参的---通过闭包形式
侦听属性
1 vue提供了一种更加通用的方式来观察和响应vue实例上的数据变动;侦听属性watch中可以执行任何逻辑。如函数节流,Ajax异步获取数据,甚至操作dom(不建议)
2 使用watch的深度遍历和立即挑一个调用功能
deep 设置true用于监听对象内部变化
immediate 设置true 将立刻表达式的当前值触发回调
两者之间VS
*watch 监听属性值,只要属相值发生变化,其都会触发执行函数回调来执行一系列操作
*computed 监听的是依赖值,依赖值不变的情况下会读取缓存进行复用,变化的情况才进行从新计算。
重点:计算属性不能执行异步任务,必须是同步的。watch可以执行异步的