Vue.js vue js中带有输入组的多个动态复选框

我试图制作一个包含输入组部分的表单，在这个组中，有一个选择框和多个复选框。复选框是根据选择框的选择填充的。还有一个添加和删除按钮，用于生成和删除输入组。选择框与v-model一起用于过滤复选框。但当我生成一个新的输入组并进行更改时，所有复选框都会更改。 我希望他们被隔离。我怎样才能做到

---

这是我的模板

类别：
请选择类别。。。
{{category.name}
{{错误['categories.+index][0]}
变异产品：
{{filteredVariationProduct.name}
{{errors['variationProducts.+index][0]}
添加
去除

下面是一个示例代码。这段代码展示了如何使用动态生成的多个复选框，以及如何将它们隔离-

newvue({
el:“应用程序”，
数据：{
项目：[“一”、“二”、“三”]，
新复选框：“”，
SelectedItems：{
“一”：“，
“两个”：“，
"三":",，
},
},
方法：{
添加：函数（）{
Vue.set（this.SelectedItems，this.newCheckbox，false）；
this.Items.push（this.newCheckbox）；
},
}
});

{{item}}
添加
输出：{{SelectedItems}}
在
variationProducts
迭代中嵌套-
类别和
filteredVariationProducts
有什么具体原因吗？您可以发布
variationProducts
成员对象的示例吗？variationProducts只是一个空的对象数组。我将它们嵌套起来，以便获得具有变体产品的相应类别。然后用户可以检查变体产品，然后所有产品都将以$refs的形式提交。