计算属性computed
处理逻辑的地方，官网上说，对于任何复杂逻辑，都应当使用计算属性。
官网解释
计算属性是有缓存的。
比如说
代码
出现‘计算了一次’
当计算属性中依赖的变量没有发生改变时，计算属性不会重新计算了，一直用的上一次计算的结果，从而提高性能。
这里尝试修改age的值，不会触发computed
修改age值
除非修改了firstName的值，计算属性会重新计算一次。
计算属性重新计算一次
方法 methods
除了计算属性，还可以通过方法来实现同样的效果。
用方法实现
【PS】计算属性直接通过属性名即可调用，方法调用要加一对括号。
但是方法这种编写不如计算属性的性能有效。
使用方法来实现，当我们更改age的时候，还是会触发方法。
方法的形式无缓存
侦听器 watch
虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的侦听器。这就是为什么 Vue通过 watch选项提供了一个更通用的方法，来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。
watch监听
最开始的fullName有个默认值，然后监听firstName和lastName，(只监听一个不行)从而让fullName进行修改。
watch也是有缓存的
watch也是有缓存的
如果一个功能可以通过以上三个方法来实现，优先使用computed，因为它既简洁，性能又高。
计算属性的setter和getter
定义了一个计算属性，当读取这个值时，getter方法会执行，当设置值的时候，setter方法被执行。
computed的set和get
将fullName修改
当依赖的值发生变化的时候，就会去重新计算，set的时候，this.firstName的值发生变化，恰好这个值又是fullName所依赖的值之一，所以就会引起fullName的重新计算，页面上所显示的fullName也就跟着变化。
firstName和lastName都变了
网友评论