vue2计算属性功法

Vue.js中的计算属性是一个非常有用的功能，可以方便地派生出一些基于现有数据的属性，并且在数据变化时自动更新。下面是使用Vue 2.x版本的计算属性的步骤和示例代码：

1. 在Vue组件中定义计算属性。计算属性可以通过在`computed`对象中添加属性来定义。每个属性都是一个函数，该函数返回计算出的属性值。

computed: {
  fullName() {
    return this.firstName + ' ' + this.lastName;
  }
}

2. 在模板中使用计算属性。计算属性可以像普通属性一样在模板中使用，不需要在模板中调用函数。Vue会自动追踪计算属性的依赖关系，并在依赖变化时重新求值。

<div>{{ fullName }}</div>

在上面的示例中，`fullName`是一个计算属性，它由`firstName`和`lastName`两个响应式数据派生而来。当`firstName`或`lastName`发生变化时，`fullName`会自动更新。

除了基于响应式数据计算属性，你还可以在计算属性中进行更复杂的逻辑操作，比如计算过滤后的列表、排序等。

希望这个简单的示例对你有帮助！如果你还有其他问题，请随时提问。