VueJS 1.0に問題があり、この動作はVueJS 2.0で機能します。 VueJS 1.0では、整数のリストがあり、チェックボックスのvモデルがバインドされていれば、整数のリストはチェックされた属性としてマップされません。ここでVueJS CheckboxモデルIntsの配列
は次にここにHTML
<div id="app">
<div class="col-sm-offset-3 col-sm-4 clearfix text-center">
<h4>On Each Day of The Week</h4>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox1" v-model="schedules[0].by_days" value="1"> M
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox2" v-model="schedules[0].by_days" value="2"> Tu
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox3" v-model="schedules[0].by_days" value="3"> W
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox4" v-model="schedules[0].by_days" value="4"> Th
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox5" v-model="schedules[0].by_days" value="5"> F
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox6" v-model="schedules[0].by_days" value="6"> Sa
</label>
<label class="checkbox-inline">
<input type="checkbox" id="inlineCheckbox7" v-model="schedules[0].by_days" value="7"> Su
</label>
<div class="clearfix"></div>
</div>
By Days: {{ schedules[0].by_days.join(', ') }}
</div>
ではJavaScriptです:
new Vue({
el: '#app',
data: {
schedules: [
{
'by_days': ["1", 2, 3]
}
]
}
})
出力が "1" を正しくcheckboxed持っていますが、2 & 3になる整数であり、確認されて表示されません。 VueJS 2.0ではこれが動作しますが、VueJS 1.0では動作しません。
フルJSFiddle
がここにあります:私は答えを見つけた https://jsfiddle.net/qf5gqsg6/
にあなたのあなたのチェックボックスの入力要素
value
を変更しても、理由値 'で数2 =「2」'の文字列ではなく、番号です。 –