vue -- computed & watch

computed

计算属性：computed属性个人理解为是用来计算重新赋值data里面指定数据的值，也可以重新用来返回一个新的数据，但是这个数据无法动态更新，但是一般建议是用来赋值data里面的属性值

data: {num: 1} // 计算 computed: { changeNum: function () { return this.num++ } } // HTML <div>{{changeNum}}</div> => // 2

computed 属性会基于data所依赖的数据进行缓存，如果不希望有缓存，请使用 method 方法替代 computed 属性默认只设置 getter 函数，不过在需要时，还可以提供 setter 函数： computed: { fullName: { // getter 函数 get: function () { return this.firstName + ' ' + this.lastName }, // setter 函数 set: function (newValue) { var names = newValue.split(' ') this.firstName = names[0] this.lastName = names[names.length - 1] } } } 通过改变fullName的值，同时也会改变firstName和lastName的值

watch

监听器：watch属性个人理解就是用来监听data里面数据变化并进行相关操作的一种工具 watch对象以data中的属性为key，vlaue是一个函数方法，这个函数方法里面有两个参数，一个是改变前的值，一个是改变后的值

data: {name: '李狗蛋'} watch: { name: function (newVal, oldVal) { console.log('名字改变了') } }

深度监听

转载于:https://www.cnblogs.com/zjh-study/p/10654686.html