jquery - 带有 Vue.js 数据表的 tr 包装器
问题描述
我有一张桌子,<tr>
里面有 2 个。我需要把这 2 包起来,<tr>
然后v-for
把它包起来。但是v-for
在<tbody>
打破数据表。
实际代码:
<table class="table table-striped" id="data_table">
<thead>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody v-for="item in items">
<tr>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
</tr>
<tr>
<td>{{ item.T }}</td>
<td>{{ item.T }}</td>
</tr>
</tbody>
</table>
试过:
<table class="table table-striped" id="data_table">
<thead>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<div v-for="item in items">
<tr>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
<td>{{ item.A }}</td>
</tr>
<tr>
<td>{{ item.T }}</td>
<td>{{ item.T }}</td>
</tr>
</div>
</tbody>
</table>
但是 div 破坏了数据表。
谢谢回答。
解决方案
而不是div
使用template
. 这将循环您的数组中的项目,而无需创建额外的元素作为包装器
推荐阅读
- javascript - 两名玩家必须尝试猜测随机数的游戏
- html - 用于删除字符串末尾的 HTML 换行符的正则表达式
- c# - 试图将 json 字符串转换为 JArray
- cmake - 任何新的#include 都会导致代码完成中断
- python - Kivy 在 android 手机中可视化来自外部 USB 摄像头的图像
- sql - 在 PLSQL 中提取左大括号“{}”之外的文本
- php - PHP - open_basedir 限制有效检查 PHP 扩展是否可以读取文件
- php - 如何防止页面重定向后重置?
- postgresql - 为什么我不能在 pgAdmin 4 中编辑用户权限?
- flutter - 无法将新选项卡动态添加到 TabBar