Hello, I've come across a modified wrapper for handling a multiple select in vue js using this. My goal is to change the value of "Bubble car" inside the vue component. Below is my code snippet.
<select2-multiple :options="car_options" v-model="input.classification">
<option disabled value="0">Select one</option>
</select2-multiple>
Here is the corresponding vue script,
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"];
}
});
I'm trying to have "Bubble car" automatically selected when the multi-select appears. Everything else seems to be functioning correctly and values are displaying properly. The potential issue may be in this line of code:
vm.input.classification = ["Bubble car"];
No errors are being shown, so any help with resolving this would be greatly appreciated.