vue.js 如何将v-model绑定到v-select

ix0qys7i 于 2022-11-17 发布在 Vue.js

关注(0)|答案(2)|浏览(191)

所以我用Vuejs / Vuetify创建了一个web表单，我需要为用户提供一个选项来编辑现有数据。我有一个“item”对象，其中包含用户可以编辑的所有属性/值。我可以通过v-model将这些绑定到v-text-field，而不会出现问题。当将现有值绑定到v-select组件时，问题出现了。它不会填充v-text-field。还需要注意的是，我需要传递给后端的是brand-id，但我需要向UI显示的是brand-name（字符串）

<v-select
 :items="brandOptions"
 :error-message="['Please select a brand']"
 required
 placeholder="Select a brand"
 item-text="brand"
 item-value="id"
 id="brand"
 v-model="product.brand"
></v-select>

vue.js

来源：https://stackoverflow.com/questions/49124175/how-to-bind-v-model-to-v-select

2条答案

按热度按时间

7gcisfzg1#

这是我的工作示例，没有v-model same sens，我只是为数据指定了值
模板

<v-select :onChange="initialPriceControll" :options="price_types"></v-select>`,
js: `export default {
  data() {
    return {
        price_type:'Fixed',
        price_types: [
            'Fixed',
            'Negotiable',
            'Giveaway'
        ],
        show_negotiable_price: false
    }
},
methods: {
    initialPriceControll(e){
        this.price_type = e;
        if (e == 'Negotiable') {
            this.show_negotiable_price = true
        } else {
            this.show_negotiable_price = false
        }
        this.$emit('selectPrice', { 
                display: this.show_negotiable_price,
                price_type: this.price_type
            });
    }
  }
}

赞(0）回复(0）举报 2022-11-17

vx6bjr1n2#

在模板中：

<v-select
  v-model="theModel"
  v-bind:items="['a', 'b', 'c', 'd']"
  label="theLabel"
 ></v-select>

在脚本中：

data() {
  return {
    theModel: ""
  }
}

赞(0）回复(0）举报 2022-11-17

我来回答

vue.js 如何将v-model绑定到v-select

2条答案

相关问题

热门标签

最新问答