Vue：更改v模型中使用的数据属性的值不会呈现新设置的值

Question

我目前正在使用Vue和Vuex创建步进器组件。每个步骤都是一个包含输入字段的组件。每个步骤都将输入字段的值存储在Vuex存储中。转到上一步时，应从商店中加载已经可用的数据并显示在相应的输入字段中。

我正在使用可正确实现v-model指令的自定义输入组件。

<custom-input v-model="amount"
              v-bind:type="'number'"></custom-input>

“数量”在数据函数中定义：

data: function () {
  return {
    amount: null
  }
}

现在，我正在尝试在安装组件时设置v-model属性的值。

mounted() {
  this.amount = this.$store.state.fields.amount.value;
}

通过调试工具，我可以看到商店拥有正确的值。组件的数量数据属性也是如此。

我还尝试过使用set方法设置属性，如下所示：

this.$set(this.$data, 'amount', this.$store.state.fields.amount.value);

但是它仍然没有显示在自定义输入中。

如何正确设置v模型中使用的数据属性，使其显示在输入字段中？

编辑

自定义输入组件的实现方式如下：

<input type="'text'" v-on:input="onInput">

onInput: function (event) {
  this.$emit('input', event.target.value);
}

Answer 1

问题是我实际上没有在自定义输入组件内绑定value属性。添加此功能可以解决问题：

<custom-input ... :value="value" />