为什么以下Vue.js代码在从计算方法切换到方法时不起作用？

在以下代码中：

根据复选框的状态禁用该按钮

但当我改变时：

  computed: {
    isDisabled: function(){
        return !this.terms;
    }
  }

到

启用/禁用不再有效

为什么会这样

根据文件：

---

在本例中，这两种方法不应该工作相同吗？

计算属性查找更改，但需要使用@change或@click之类的方法调用方法。在这种情况下，实际上可以只绑定数据对象，而不绑定任何一个对象

<div id="app">
  <p>
    <label for='terms'>
      <input id='terms' type='checkbox' v-model='terms' /> I accept terms!!!
    </label>
  </p>
  <button :disabled='!terms'>Send Form</button>
</div>

new Vue({
  el: '#app',
  data: {
    terms: false
  }
})

我接受条件！！！

发送表格
新Vue({
el:“#应用程序”，
数据：{
术语：假
}
})

计算和方法是两件不同的事情

方法：当你想做某事时调用，比如调用一个动作/突变，或者做一些与存储/状态无关的事情

计算的：您可以使用返回值在html模板中绑定某个内容，该内容根据某些计算而变化。如果它不会改变，那么就把它绑定到一个日期/状态

在当前脚本中，

isDisabled

数据一直在更改。 因此，每当您的数据更改其功能时，都会自动触发

但是，如果您希望在方法中使用此函数，则应该手动触发该函数。 例如：

<input id='terms' type='checkbox' v-model='terms' @change="isDisabled" /> I accept terms!!!

我接受条款！！！

它将在更改时调用isDisabled方法

---

更多细节。谢谢

因为计算是反应性的，所以方法不是。如果在这种情况下使用方法，则需要在每次检查/取消检查输入时调用该方法。

<input id='terms' type='checkbox' v-model='terms' @change="isDisabled" /> I accept terms!!!