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小时内删除。