Vue-输入带有多个复选框

我正在基于数组渲染一些复选框，并使用data属性作为v模型。我正在使用Vue2。

但是，由于v-model的值等于1（我想将其视为布尔值而不是数字）时，由于某种原因，我最终选中了所有复选框。

我尝试了v-model.number-没有任何运气。我究竟做错了什么？

我的模板：

    
    
    {{ item.category }} : {{ category.id }}

模型数据（item.category）：

1

分类：

[
  {
    "id": 2,
    "name": "news Category 0"
  },
  {
    "id": 7,
    "name": "news Category 1"
  },
  {
    "id": 12,
    "name": "news Category 2"
  },
  {
    "id": 17,
    "name": "news Category 3"
  },
  {
    "id": 22,
    "name": "news Category 4"
  },
  {
    "id": 27,
    "name": "news Category 5"
  },
// other values
]

屏幕截图（已将item.category和category.id添加为标签文本，以使其更加清晰）：

当您使用多个复选框时，必须在v模型中提供一个数组，因此您item.category必须是一个数组：[1]。

参见工作提琴：https : //jsfiddle.net/mimani/y36f3cbm/

var demo = new Vue({
  el: '#demo',
  data() {
    return {
      categories: [{
        "id": 2,
        "name": "news Category 0"
      },  {
        "id": 92,
        "name": "news Category 8"
      }, {
        "id": 97,
        "name": "news Category 9"
      }],
      item: {
        category: [1]
      }
    };
  }
})