Quasar 动态复选框不是空的 onload

Quasar dynamically checkboxes are not empty onload

当我尝试设置多个复选框时 none 加载时它们是空的。请参阅代码笔: 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>