Vue 计算属性和使用的小技巧

1， 计算属性可以进行复杂的逻辑处理，只要返回一个结果就可以
2，每一个计算属性都有setter，getter
<div>{{ fullName }}</div>

var app =  new Vue({    el: '#app',    data : {        firstName: 'H',        lastName: 'L'
      },    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]
              }
          }
      }
})

当执行 app.fullName = 'John Doe'时，setter就会被调用

小技巧：
（1），计算属性可以依赖其他计算属性
（2），计算属性不仅可以依赖当前的Vue实例的数据，还可以依赖其他实例的数据

同样在methods里定义的一个方法也可以实现同样的效果，为什么还要使用计算属性，因为一个计算属性是几句他的依赖缓存的，一个计算属性所依赖的数据发生变化是，它才会从新获取值。

作者：是归人不是过客
链接：https://www.jianshu.com/p/cd5929a7dc95