Question

我正在使用Vue 2.5.17和Select2 4.0.6-rc.1。

我有一个输入字段，可以在其中选择选项。我想将所选选项传递给商店对象。

这是组件中的代码：

<select2 type="text" :options="bereiche" v-model="bereichInput" class="form-control">

（..）

computed: {
    bereichInput:{
        get () {
            return this.$store.state.bereichInputStore
        },
        set (value) {
            console.log("value="+value+"!");
            this.$store.commit('setBereichInput', value)
        }
    }
}

这是商店中的代码：

setBereichInput(state, bereichInput)
      {
        state.bereichInputStore = bereichInput;
        console.log("Test bereich"+state.bereichInputStore+"!!!!");
      }

在测试ist时，我在控制台中收到以下消息：

“测试bereich ！！！” 因此，一切都没有通过！

我在做什么错了？

提前谢谢！

Answer 1

使用该组件时，不能将v-model与vuex一起使用。您需要自己处理值的更改，并使用:value进行绑定捕获@input来确定值何时更改。观察：

<select2 @input="updateBereiche"
         :options="bereiche"
         :value="bereichInput" 
         class="form-control">

然后，您将添加一个名为updateBereiche的新方法

methods: {
  updateBereiche(value) {
      this.$store.commit('setBereichInput', value)
  }
}

删除您的setter，现在不再需要。

select2值未更新

1 个答案: