vue2计算属性

Vue.js 2.x 版本中，计算属性是通过在 Vue 实例中定义 computed 属性来实现的。计算属性本质上是一个函数，它的返回值会被 Vue.js 缓存起来，只有在依赖的属性发生变化时才会重新计算。这个特性可以让我们在模板中使用计算属性，而不必担心性能问题。

以下是一个示例：

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!',
  },
  computed: {
    reversedMessage: function() {
      return this.message.split('').reverse().join('');
    }
  }
})

在上面的代码中，我们定义了一个计算属性 `reversedMessage`，它返回 `message` 的反转字符串。在模板中，我们可以像使用普通属性一样使用计算属性：

<div id="app">
  <p>{{ message }}</p>
  <p>{{ reversedMessage }}</p>
</div>

当 message 的值发生变化时，reversedMessage 也会自动更新。