vue {{}} 调用方法

<template>
  <div>
    <!-- 调用方法并显示结果 -->
    <p>{{ formatDate(date) }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      date: new Date()
    };
  },
  methods: {
    formatDate(date) {
      return date.toLocaleDateString();
    }
  }
};
</script>

<template>
  <div>
    <!-- 使用计算属性 -->
    <p>{{ formattedDate }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      date: new Date()
    };
  },
  computed: {
    formattedDate() {
      return this.date.toLocaleDateString();
    }
  }
};
</script>

<template>
  <div>
    <p>{{ asyncResult }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      asyncResult: ''
    };
  },
  methods: {
    async fetchData() {
      const response = await fetch('some-api');
      const data = await response.json();
      this.asyncResult = data;
    }
  },
  mounted() {
    this.fetchData();
  }
};
</script>