Vue之循环遍历Json数据,填充Table表格简单记⼀次Vue循环遍历Json数据,然后填充到Table表格中,展⽰到前端的代码:
1 async getData(id) {
2const res = await this.$wReq('/xxx/xxx/xxx/' + id).get();
3if (de === 0) {
4
5this.data = res.data;
6 }
7 },
下⾯是定义变量:
1 data: {
2 base: {},
3 baseList:[],
4 },
下⾯是table的表格展⽰:
1 <table class="el-table el-table--fit el-table--border table-detail">
2 <thead>
3 <tr>
4 <th>ID</th>
5 <th>⽂章id</th>
6 <th>分类名称</th>
7 <th>分类等级</th>
8 <th>创建时间</th>
9 </tr>
10 </thead>
11 <tbody>
12 <tr v-for="cm in data.categoryMapList">
13 <td v-text="cm.id"></td>
14 <td v-text="cm.docId"></td>
15 <td v-text="cm.categoryName"></td>
16 <td v-text="cm.categoryLevel"></td>
17 <td v-text="cm.createTime"></td>
18 </tr>
19 </tbody>
vue json字符串转数组20 </table>
效果图:
打完收⼯!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论