computed
-
computed在Vue是作为计算属性存在的，什么是计算属性？就是计算一个值呗。
-
假如我们的data里面有一个a的属性，当a发生改变就会执行computed里面的display函数，computed里面的代码如下：
var vm = new Vue({ data: { a: 1 }, computed: { display: function () { console.log('11111111111111111') return this.a * 2 }, }}).$mount("#app");console.log(vm.display)vm.a = 3console.log(vm.display)console.log(vm.display)vm.a = 2console.log(vm.display)// 11111111111111111 // 2 // 11111111111111111 // 6 // 6 // 11111111111111111 // 4
a如果没发生改变，那display这个函数就不会执行。
watch
-
watch 在Vue中作为监听器而存在，什么是监听器？就是监听一个值呗。
-
假如，我们的data中有一个a:1, watch监听这个a的代码如下：
var vm = new Vue({ data: { a: 1 }, watch: { a: function () { console.log('11111111111111111') return this.a * 2 }, }}).$mount("#app");console.log(vm.a)vm.a = 3console.log(vm.a)console.log(vm.a)vm.a = 2console.log(vm.a)// 1 // 3 // 3 // 2 // 11111111111111111
watch是没有缓存的，watch是异步的。
总结：
- computed是计算属性，它是有缓存的。
- watch是监听器，是没有缓存，是异步的。
