H5W3
当前位置:H5W3 > 其他技术问题 > 正文

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

图片描述

要做的效果是先遍历一个数组生成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使之对应勾上,但第二层的数据该怎么依次展示呢?

回答:

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

回答:

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

本文地址:H5W3 » 同个元素能绑2个v-for吗?

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址