一、总述
computer和watch都是vue监听数据变化的属性。
二、computed计算属性
computed本就是计算机的含义,就是用来计算的。
如果函数所依赖的属性没有发生变化,从缓存中读取。
必须有return返回。
使用方法和data中的数据一样,可以做执行方法,对其进行传值接收进行处理。
三、watch监听属性
watch可以监听data中数据的值也可以监听computed计算属性的值,必须与数据的值一样。
watch有个handler函数接受两个参数新数据和旧数据。普通监听直接用数据名当函数接受参数。
watch函数不需要调用。
只间听数据的值是否发生变化,不会监听的数据的地址是否发生变化,数据结构比较深的话需要深度监听设置deep:true。
页面首次加载需要执行的话设置immediate:true。
四、区别
computed是计算属性,watch是监听一个值的变化而执行对应的回调。
computed函数所依赖的属性不变的时候会调用缓存;watch每次监听的值发生变化时候都会调用回调。
是否调用return:computed必须有;watch可以没有
使用场景:computed当一个属性受多个属性影响的时候;例如购物车商品结算;watch当一条数据影响多条数据的时候,例如搜索框
是否支持异步:computed函数不能有异步;watch可以