Vue之循环遍历Json数据，填充Table表格

简单记一次Vue循环遍历Json数据，然后填充到Table表格中，展示到前端的代码：

 async getData(id) {
     const res = await this.$store.api.newReq('/xxx/xxx/xxx/' + id).get();
     if (res.code === 0) {

         this.data = res.data;
     }
 },

下面是定义变量：

 data: {
     base: {},
     baseList:[],
 },

下面是table的表格展示：

 <table class="el-table el-table--fit el-table--border table-detail">
     <thead>
         <tr>
             <th>ID</th>
             <th>文章id</th>
             <th>分类名称</th>
             <th>分类等级</th>
             <th>创建时间</th>
         </tr>
     </thead>
     <tbody>
         <tr v-for="cm in  data.categoryMapList">
             <td v-text="cm.id"></td>
             <td v-text="cm.docId"></td>
             <td v-text="cm.categoryName"></td>
             <td v-text="cm.categoryLevel"></td>
             <td v-text="cm.createTime"></td>
         </tr>
     </tbody>
 </table>

效果图：

打完收工！