Vue js：複数オプションの選択

Question

目的：選択タグの複数のオプションを選択します。

試み：documentation言う：複数選択入力を実装するために、v-modelを使用してバインドするプロパティは配列でなければなりません。

エラー： [Vue警告]：バインディングにはArray値が必要ですが、Stringを取得します。

（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：だけを選択した作品でmultiple="true"を与える

<script src="https://unpkg.com/vue@2.0.6/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 }} 

Answer 1

。ここはjsfiddle linkです。

<select 
     multiple="true" 
     v-bind:class="{ 'fix-height': multiple === 'true' }" 
     v-model="multipleSelections" 
     >