vue3 配置数据用于for循环遇到的坑

问题：

比如需要循环一堆CheckBox，为了少在template里写代码，需要配置一组数据循环一下，配置里面包括CheckBox需要绑定的值，CheckBox group需要绑定的值，以及绑定的change事件等，有两层循环，这时最里面的循环绑定的值失去了响应性，导致CheckBox选不上。

解决方法：

这个配置写成响应式的，即最外层包裹ref

如：

<template v-for="item in myConfig" :key="item.id">
    <n-checkbox 
        :checked="item.checked" 
        :label="item.label"    
        @update:checked="item.checkedChange" />
    <n-checkbox-group v-model:value="item.modelVal">
        <template v-for="fd in item.field" :key="fd">
            <n-checkbox :value="fd" :label="fd" />
        </template>
    </n-checkbox-group>
</template>

const myConfig = ref([
{
    fields: fields1,
    label: '某某某',
    modelVal: selectedFields1,
    checked: fields1Checked,
    handleUpdateValue: handleUpdateValue1,
    checkedChange: checkedChange1
}
])