1. 什么是computed
computed（计算属性）是Vue.js中一个十分重要的特性，它可以根据依赖的数据自动更新视图，避免了DOM操作和手动维护计算属性的繁琐过程。在使用Vue.js开发大型应用时，computed是必不可少的一个工具。
与methods不同，computed属性是基于依赖进行缓存的。也就是说，只有计算属性所依赖的数据发生变化才会触发computed的重新计算过程，否则直接返回之前的缓存结果。computed的这种缓存机制可以大大提高应用的性能。
2. 使用computed
2.1 基本用法
我们可以通过Vue实例的computed选项来定义一个计算属性。计算属性通过声明式的方式区分methods，这样我们就可以像访问普通属性一样去访问它，而不需要手动去调用一个方法。例如，我们可以用以下方式计算一个字符串的长度：
new Vue({
data: {
message: 'Hello Uniapp!'
},
computed: {
messageLength: function () {
return this.message.length
}
}
})
上述代码中，我们定义了一个computed属性messageLength，它的值就是this.message.length。可以看到，我们不需要通过methods来定义一个方法去计算字符串的长度，而是直接定义了一个有返回值的函数，并将它赋值给计算属性messageLength。
2.2 计算属性的依赖
当计算属性需要依赖多个数据属性时，我们可以直接在computed函数中访问这些属性，这样当这些属性变化时，计算属性也会相应地更新。例如：
new Vue({
data: {
firstname: '李',
lastname: '雷'
},
computed: {
fullName: function () {
return this.firstname + this.lastname
}
}
})
上述代码中，我们定义了一个计算属性fullName，它依赖了data选项中的firstname和lastname两个属性。如果我们修改了其中一个属性，fullName就会重新计算并更新视图。
2.3 计算属性的setter
在有些情况下，我们需要对计算属性进行赋值。对于这种情况，Vue提供了计算属性的setter方法。例如：
new Vue({
data: {
firstName: 'Li',
lastName: 'Lei'
},
computed: {
fullName: {
get: function () {
return this.firstName + ' ' + this.lastName
},
set: function (newValue) {
var names = newValue.split(' ')
this.firstName = names[0]
this.lastName = names[names.length - 1]
}
}
}
})
上述代码中，我们使用了计算属性fullName的get和set方法，get方法用来获取fullName的值，set方法用来设置fullName的值。在set方法中，我们将输入的fullName字符串按空格分割成数组，然后分别赋值给firstName和lastName属性。由此可见，Vue的计算属性不仅可以用于页面的展示，还可以用于数据的双向绑定。
3. 计算属性VS方法
3.1 基本区别
在Vue中，既可以使用计算属性，也可以使用methods定义一个方法来计算数据。两者的主要区别在于：计算属性是基于缓存的，只有相关依赖发生改变才会重新计算；而方法则是每次调用都会执行一遍。
new Vue({
data: {
message: 'Hello Uniapp!'
},
computed: {
reversedMessage: function () {
return this.message.split('').reverse().join('')
}
},
methods: {
reverseMessage: function () {
return this.message.split('').reverse().join('')
}
}
})
上述代码中，我们定义了一个计算属性reversedMessage和一个方法reverseMessage，它们的功能是一样的，都是将message反转并返回。但是，每次调用reverseMessage方法都会重新计算一遍，而在计算属性中，只有message发生了变化，才会重新计算反转后的值。
3.2 简单情景下的选择
在简单的情况下，选择使用计算属性还是方法是无关紧要的。但是当数据处理量比较大、嵌套比较深时，建议使用计算属性，可以方便数据的复用和统一管理。
4. 总结
computed是Vue.js中一个非常实用的特性，在页面数据计算和渲染中起到了至关重要的作用。使用计算属性可以大大简化页面数据的计算和绑定，而且还可以优化性能，节省内存。理解computed的原理和使用方法，可以让我们更加高效地开发Vue.js应用。