首页 > 解决方案 > 如何在 Vue.js 中循环打印 JSON 数据

问题描述

我有这个 JSON 数据

{
"districtData": {
    "East Delhi": {
        "lastupdatedtime": ""
    },
    "South West Delhi": {
        "lastupdatedtime": ""
    },
    "West Delhi": {
        "lastupdatedtime": ""
    },
    "Delhi": {
        "lastupdatedtime": ""
    },
    "South Delhi": {
        "lastupdatedtime": ""
    },
    "North East Delhi": {
        "lastupdatedtime": ""
    },
    "North Delhi": {
        "lastupdatedtime": ""
    },
    "North West Delhi": {
        "lastupdatedtime": ""
    },
    "Unknown": {
        "lastupdatedtime": ""
    }
  }
} 

我想循环打印它并想像这样显示

East Delhi    lastupdatedtime 
North west   lastupdatedtime

等等

<tr v-for="data in jsonData" :key="data.id"> 
   <td>{{ data}}</td>
</tr>

我试过了,但我只得到lastupdatedtime. 任何人都可以帮忙吗?提前致谢。

标签: javascriptvue.jsvuejs2

解决方案


你也可以使用

 <tr v-for="(data,index) in jsonData" :key="index"> 
  <td>{{ data.districtData}}</td>
  </tr>

推荐阅读