同个元素能绑2个v-for吗？

Question

要做的效果是先遍历一个数组生成dom节点（如上图），再遍历另一个数组把对应的数据填进去（勾选数据中的checkbox，填入每行后面的input值）
我现在代码是这么写的：

<div class="m-y-t" style="max-height: 150px; overflow-y: auto;">
    <el-checkbox-group v-model="chosenLiability">
        <div v-for="o in liabilityOpt" :key="o.value">
            <el-checkbox :value="o.value" :label="o.label"></el-checkbox>
            ：
            <div class="m-x-r" v-for="i in o.senate" :key="i.value" style="display: inline-block; width: 25%;">
                <el-input size="mini">
                    <template slot="append">{{i.name}}</template>
                </el-input>
            </div>
        </div>
    </el-checkbox-group>
</div>

应该勾选的checkbox可以通过遍历数据的第一层value填入chosenLiability使之对应勾上，但第二层的数据该怎么依次展示呢？

Answer 1

不如自己定义个数组，预先整理组合2组数据到一块，再渲染。

Answer 2

建议先定一个数组把两个步骤合并，再用v-for循环出来