vue.js 的 v-for列表渲染问题

Question

<tbody id="show-blog-type-module" onclick="return clickTr(event)" > <tr v-for="(blogType,index) in blogTypes"> <td>{{index++}}</td> <td>{{blogType.id}}</td> <td>{{blogType.name}}</td> <td>{{blogType.detail}}</td> <td>{{blogType.blogs.length}} <a class="pointer" v-on:click="showBlogs"> <span class="glyphicon glyphicon-resize-full"></span> </a> </td> <td> <a class="pointer"> <span class="glyphicon glyphicon-edit"  title="编辑"></span> </a> </td> <td> <a :href="'manager/blogType/delete?id='+blogType.id"> <span class="glyphicon glyphicon-trash" title="删除"></span> </a> </td> <td> <a :href="'blog/type?id='+blogType.id"> <span class="glyphicon glyphicon-link" title="浏览"></span> </a> </td> </tr>     </tbody>我想在这个循环的tr中做一个手风琴的效果，如果想在表格中用v-for一次渲染两列<xxx v-for="(blogType,index) in blogTypes">     <tr></tr>     <tr></tr> </xxx>但是这样会vue报错 v-for 不会渲染应为浏览器识别不了xxx标签。敢问各位大侠有什么好方法吗？

Answer 1

使用template标签看看

<template v-for="(blogType,index) in blogTypes">
    <tr></tr>
    <tr></tr>
</template>