Quasar动态复选框在加载时不为空

问题描述

当我尝试具有多个复选框时，它们都不是空加载。请参阅codepen： https://codepen.io/cbrown___/pen/ZEWvGXq?editable=true&editors=101%3Dhttps%3A%2F%2Fquasar.dev%2Fvue-components%2Fbutton

非常简单，我只希望它们在页面加载时为空。 我该如何解决？

<div id="q-app">
  <div class="q-pa-md">
    <div class="q-gutter-sm">
      <span  v-for="(c,index) in categories">
      <q-checkBox v-model="val[index]" :label="c.label"></q-checkBox>
      </span>
    </div>

    <div class="q-px-sm">
    </div>
  </div>
</div>


new Vue({
  el: '#q-app',data () {
    return {
      val: [],categories:[{id:1,label:'crime'},{id:2,label:'fun'},{id:3,label:'other'}]
    }
  }
})

解决方法

因此，在尝试了所有内容之后，我来到了解决此问题的页面。

这是正确的方法：

<q-checkbox v-model="val" :label="c.label"></q-checkbox>