Question

问题

如何创建一个虚拟computed属性，当它依赖于变化的模型元素而不必说出计算属性时会被调用？

背景

我的父亲是一些表单控件，用于设置ajax查询参数。当他们改变时，我需要从服务器获取数据，然后我$emit新的数据到子组件。

最初，我在每个元素上都通过method调用updateTable @change="updateTable()"。

不想将@change添加到我的input所有内容中，所以我创建了一个虚拟计算属性来使用自动依赖项检测/重新计算。问题是Vue也是＆＃34;＆＃34;在我的情况下很聪明，因为我实际上并没有在任何地方引用计算属性。解决方法是添加<div style="display:none">{{dummyProp}}</div>，但这看起来很糟糕。

我的模式错了吗？或者有更好的Vue方式吗？

Answer 1

您的计算属性不需要被HTML引用以保持被动。例如，您可以：

data: {
  return {
    inputA: 'A',
    inputB: 'B'
  }
},
computed: {
  myProperty() {
    return this.inputA + this.inputB
  }
},
methods: {
  callWithMyProperty() {
    ajaxFunction(this.myProperty)
  }
}

每当您使用此类模式致电callWithMyProperty时，它都会使用最新版本的inputA和inputB。我假设您可能正在使用不同的（可能是非Vue）模式，这导致了问题。

Answer 2

您应该computed生成查询参数对象。当表单输入更改时，查询参数对象会更新。一个观察者发送ajax请求，其回调更新我希望是子组件的道具。

如果您的表单元素绑定到变量，那么您不应该使用@change，您应该一直在观察变量 - 而且您将会这样做，因为那是computed所做的

Vue计算的属性，不在

问题

背景

2 个答案: