VueJS复选框模型整数数组

Question

我对 VueJS 1.0 有问题，这种行为在 VueJS 2.0 中有效。在 VueJS 1.0 中，如果我有一个整数列表并绑定了一个复选框 v-model，则整数列表将不会映射为已选中的属性。

这是 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”，但 2 和 3 是整数，不会显示为选中状态。在 VueJS 2.0 中这有效，但在 VueJS 1.0 中无效。

完整的 JSFiddle 可在此处获得：https ://jsfiddle.net/qf5gqsg6/

Answer 1

我找到了答案，我需要将值设置为绑定到输入，而不是仅仅依赖于输入中的值。

所以而不是：

<input type="checkbox" v-model="schedules[0].by_days" value="2"> M

它需要是：

<input type="checkbox" v-model="schedules[0].by_days" v-bind:value="2"> M

当然，如果有一个混合字符串和整数的列表，这不起作用，但在我的情况下，它的工作原理是一切都是整数。