方法

这里的方法指的是普通的方法，并非事件处理方法。事件处理方法相关内容在后续章节。

除了在事件处理中触发方法的执行，你还可以在插值表达式中去调用方法，并传参。

<p>{{ statusFromId(1) }}</p>
<p>{{ statusFromId(status) }}</p>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>

<script>
const vm = new Vue({
  el: '#app',
  data() {
    return {
      status : 2
    }
  },
  methods: {  // 看这里，看这里，看这里
    statusFromId(id) {
      const status = ({
          0: '睡觉',
          1: '吃饭',
          2: '学习 Vue'
      })[id];

      return status || '未知状态: ' + id;
    }
  }
});
</script>

除了在插值表达式中使用方法，你还可以在属性绑定中使用它们。实际上，任何可以使用 JavaScript 表达式的地方都可以使用方法。

<button v-bind:type="buttonType()">Button</button>
<ul>
  <li v-for="dog in dogs()"> {{ dog }}</li>
</ul>

methods: {
  buttonType() {
    return "submit";
  },
  dogs() {
    return ['tommy', 'jerry', 'ben'];
  }
}