vue利用v-for嵌套输出多层对象，分别输出到个表

来源：互联网发布：常青藤软件cad2014 编辑：程序博客网时间：2024/05/21 10:25

specifications:[    {        specificationName:"颜色",        specificationItem:[            {value:"黄色"},            {value:"黑色"}            ]    }]
<table class="table table-bordered  table-hover table-item spggdytable"       id="ggxtable" v-show="isAddSpecifications">    <thead>    <tr>        <th>排序</th>        <th>规格项</th>        <th>操作</th>    </tr>    </thead>    <tbody>    <tr v-for="(item,index) in specifications">        <td>{{index}}</td>        <td>{{item.specificationName}}</td>        <td>            <a href='#'> <img src='../img/common_edit@25.png' alt='修改'></a>            <a href='#'><img src='../img/common_del@25.png' alt='删除'></a>        </td>    </tr>    </tbody></table><table class="table table-bordered  table-hover table-item spggdytable"       id="ggztable" v-show="isAddSpecifications">    <thead>    <tr>        <th>规格值</th>        <th>操作</th>    </tr>    </thead>    <tbody v-for="(item,index) in specifications">    <tr v-for="(part,n) in item.specificationItem">        <td>{{part.value}}</td>        <td>            <a href='#'> <img src='../img/common_edit@25.png' alt='修改'></a>            <a href='#'><img src='../img/common_del@25.png' alt='删除'></a>        </td>    </tr>    </tbody></table>

0 0