0
目標:選擇選擇標籤的多個選項。Vue js:多個選項選擇
嘗試:的documentation說:實現一個多選擇輸入,使用v-model
應的陣列結合的性質。
錯誤: [Vue警告]:期望一個數組的值綁定,但得到了字符串。
綁定到(multipleSelections
)的值是一個數組,那麼這是什麼原因?
這裏是jsfiddle。
腳本:
new Vue({
el:'#app',
data: function() {
return {
multipleSelections: ["Mr Potato (Manager)"],
data: null,
multiple: "true",
assets:["Mr Potato (Manager)", "Mr Blade (Manager)", "Mrs Spice (Manager)"]
}
},
created() {
console.log("selections: ",this.multipleSelections);
}
});
HTML:
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<div class='container' id='app'>
<h2>{{"title".toUpperCase()}}</h2>
<p class='center help-text' v-if="multiple === 'true'">(Use ctrl or cmd to select multiple)</p>
<select
:multiple="multiple === 'true'"
v-bind:class="{ 'fix-height': multiple === 'true' }"
v-model="multipleSelections"
>
<option
v-for="asset in assets"
:value="asset">
{{asset}}
</option>
</select>
{{ multipleSelections }}
謝謝,我會接受這個答案,儘管我已經使用了這個表達式,以便我可以使用這個組件用於單一和多選擇使用。任何想法我可以做到這一點? –
@AmreshVenugopal不知道爲什麼這不起作用,我嘗試了很多方法,如果我發現相關的東西會回覆你。 – Saurabh