Question

我在vue multiselect中使用v模型遇到麻烦。多重选择要求将要传递给v模型的对象具有初始选定值，以便它可以将该对象与“对象”选项匹配。这是我的代码示例：

<b-tr v-for="(income, index) in this.incomes" :key="income.id">
     <b-td>
          <multiselect
            :options="selectAccount"
            v-model="{id:income.account_id,account:income.accounts.account}"
            label="account"
            track-by="id"
          ></multiselect>
        </b-td>
</b-tr>

Vue不接受以这种方式将对象传递给v模型，我无法找出另一种方式。

这是收入对象：

incomes: Array
  0: Object
    account_id:
    accounts: Object
      account: 
      id:
    amount:
    id:
    date:

选项：

options: Array[3]
  0: Object
    account:
    id:

Answer 1

您可以建立与数组相关的v模型，该数组通过主数组的索引传递每个元素，例如：

v-model="selected_options[index]"

，然后将selected_value设置为数组：

selected_options: []

Answer 2

不能将v-model与多个值一起使用

“ Component v-model专为单值输入组件而设计，   参加本机输入元素的类似用例。

对于管理多个同步的复杂组件   一个值，显式的prop / event对是正确的解决方案。在这   特殊情况下，我认为保存的击键不值得添加   附加语法的复杂性。”


https://github.com/vuejs/vue/issues/4946

PS。 Vue v3将于Q1 / 20结束时提供v-model支持多个值，语法类似于v-model:id="income.account_id"

使用VuejS在v模型中传递对象

2 个答案: