computed 和 method的不同之处

在Vue.js中，computed和method都是用于定义在Vue实例中的方法，但它们之间有几个关键的不同之处：

1. 缓存 vs 重复计算：

computed属性会在相关响应式依赖发生变化时才重新计算，并且会缓存计算结果，直到依赖发生变化才会重新计算。这意味着只要相关依赖没有发生变化，多次访问computed属性都会返回之前缓存的结果，不会重复执行计算。
methods方法在每次调用时都会执行计算。如果在模板中多次调用了一个方法，每次都会重新执行该方法的计算逻辑。

2. 语法：

computed属性定义为一个函数，并且可以直接在模板中像访问数据属性一样使用，无需调用。
methods方法需要在模板中通过方法名来调用，并且需要在调用时加上括号。
示例：

<template>
  <div>
    <p>Computed: {{ computedValue }}</p>
    <p>Method: {{ methodValue() }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dataValue: 10
    };
  },
  computed: {
    // computed属性
    computedValue() {
      return this.dataValue * 2;
    }
  },
  methods: {
    // method方法
    methodValue() {
      return this.dataValue * 2;
    }
  }
};
</script>

在上面的例子中，computedValue是一个computed属性，methodValue是一个method方法。当dataValue发生变化时，computedValue只会重新计算一次，而methodValue每次在模板中被调用时都会执行。

总的来说，如果需要进行简单的数据转换或计算，并且希望缓存结果以提高性能，应该使用computed属性。而对于每次都需要执行的逻辑或与模板无关的方法，则应使用methods方法。