时间戳

首页 > 解决方案 > 使用 vue js 多选动态更改选项

javascript - 使用 vue js 多选动态更改选项

问题描述

嗨，我正在使用这个修改后的包装器来处理 vue js 的多项选择。我正在尝试更改此内部 vue 组件的值。这是我的代码。

<select2-multiple :options="car_options" v-model="input.classification">
       <option disabled value="0">Select one</option>
</select2-multiple>

这是我的 vue 脚本，

var vm = new Vue({
    el: '#el',
    delimiters: ["[[", "]]"],
    data: {
        input: {
            classification: []
        },
    },
    created: function () {
        var vm = this;
        vm.car_options = [
            {id: "Bubble car", text: 'Bubble car'},
            {id: "diesel", text: 'Diesel'},
            {id: "electric", text: 'Electric'},
            {id: "electric_diesel", text: 'Electric/Diesel'},
            {id: "electric_gasoline", text: 'Electric/Gasoline'},
            {id: "ethanol", text: 'Ethanol'},
            {id: "gasoline", text: 'Gasoline'},
            {id: "hydrogene", text: 'Hydrogene'},
            {id: "lpg", text: 'Liquified petroleum gas (LPG)'},
            {id: "other", text: 'Other'},
        ];
        vm.input.classification = ["Bubble car"];
    }
});

我想要做的是当出现多选时应该自动选择泡泡车。如果有人可以提供帮助，那就太好了。多选工作正常，值也出现了。所以我认为问题在这里，

vm.input.classification = ["Bubble car"];

没有显示错误信息。

标签： javascriptvue.js

解决方案

似乎对我来说工作正常 - JsFiddle

vm.input.classification = [vm.car_options[0].id]

推荐阅读