Vue.js 复选框不适用于使用 Laravel SparkForm 的模型

Question

我设置了以下复选框：

<label v-for="service in team.services">
    <input type="checkbox" v-model="form.services" :id="service.name" :value="service.id"/>
</label>

这些都显示正确但在选中一个复选框时，它们都被检查为表单.Services模型将设置为false / true。

但是，当将模型更改为另一个数据属性时，例如“服务”一切都按预期工作。为什么这在 SparkForm 中不起作用？

示例数据：

data: function() {
        return {
            form: new SparkForm({
                userId: null,
                services: [] // always only gets set as true / false
            }),
            services: [], // works fine
        }
    },

Answer 1

new Vue({
    el: '#app',
    data(){
      return {
        form : {
           services : []
        },
      team : {
        services : [
         {
         "name" : "Service name #1",
         "id" : 1
         },
         {
         "name" : "Service name #2",
         "id" : 2
         }
        ]
      }
     }
    }
});

<div id="app">
  <label v-for="service in team.services">
    <input type="checkbox" v-model="form.services" :value="service.id"/>{{service.name}}
  </label>
{{form.services}}
</div>