基于Vue的computed属性(不能异步，可以缓存)

特点：不能异步，可以缓存

Vue的computed属性是一种计算属性，它能够根据其他属性的值计算出新的值，并且在依赖的属性值发生改变时自动更新。在Vue中使用computed属性可以简化代码，提高应用程序的性能。

下面是一个基于Vue的computed属性的例子：

<template>
  <div>
    <p>商品总价：{{ totalPrice }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      price: 10,
      quantity: 2
    }
  },
  computed: {
    totalPrice: function() {
      return this.price * this.quantity;
    }
  }
}
</script>

在上面的例子中，我们定义了一个computed属性totalPrice，它根据data属性中的price和quantity计算出商品的总价，并将结果显示在页面中。每次price或quantity发生变化时，totalPrice都会自动更新。