VUEcomputed

Vue 的 computed 属性是用来定义计算属性的。计算属性是根据其他属性的值计算得出的属性，它们的值会被缓存起来，只有在依赖的属性发生变化时，才会重新计算。

在 Vue 组件中，可以通过 computed 属性来定义计算属性。例如：

// Vue 组件的定义
Vue.component('example', {
  data() {
    return {
      firstName: 'John',
      lastName: 'Doe',
    };
  },
  computed: {
    fullName() {
      return this.firstName + ' ' + this.lastName;
    },
  },
});

在上面的例子中，我们定义了一个计算属性 fullName，它由 firstName 和 lastName 这两个属性计算得出。computed 属性中的每个属性都是一个函数，函数的返回值就是计算属性的值。

计算属性可以像普通属性一样在模板中使用：

<!-- 模板中使用计算属性 -->
<template>
  <div>
    First Name: {{ firstName }}<br>
    Last Name: {{ lastName }}<br>
    Full Name: {{ fullName }}<br>
  </div>
</template>

当 firstName 或 lastName 的值发生变化时，fullName 会自动重新计算并更新模板中的显示。这样可以方便地实现一些复杂的属性计算逻辑，而无需手动监听属性变化并手动更新计算结果。