vue计算属性

computed处理一些复杂的逻辑会很有用，相信大家有个疑问，该属性和methods有什么区别？
computed是基于它的缓存依赖，只有相关依赖发生时才会重新取值而methods在重新渲染时，函数总会重新调用执行。

<template>
  <div>
    <h1>原始字符串：{{message}}</h1>
    <h2>计算后反转的字符串：{{reversedMessage}}</h2>
    <input type="text" v-model="message" />
    <button @click="getdate()">getdata</button>
  </div>
</template>
<script>
import { all } from "q";
export default {
  data() {
    return {
      message: "夜魔"
    };
  },
  computed: {
    reversedMessage: function() {
      return this.message
        .split("")
        .reverse()
        .join("");
    }
  },
  methods: {
    getdate() {
      alert(this.message);
    }
  }
};
</script>

以上代码无法满足我的要求，改天在完善一下，或者哪位大神可以帮我完善一下，毕竟用后端的思想又是难以理解前端。

来源：https://www.cnblogs.com/c546170667/p/11318120.html