【数据处理】我这个后端要处理前端的问题,json字符串怎么传值??

简要说明:对于前端怎么处理数据?

详细:前端通过axios发送请求然后后端返回json字符串,对于前端是如何去获取的并且展示出来,我这里出了点问题

#java #前端 #vue #json

<template>
		<v-card class="blog-card animated zoomIn mt-5">
            <div class="web-info-title">
              <v-icon size="18">mdi-chart-line</v-icon>
              国内
            </div>
            <div class="web-info">
              <div style="padding: 4px 0 0">
                数据来源:{{ tableData.dataSource }}
              </div>
              <div style="padding: 4px 0 0">
                {{ tableData.updateTime }}
              </div>
              <div style="padding: 4px 0 0">
                全国累计确诊病例:{{ tableData.totalConfirmed }}
              </div>
            </div>
          </v-card>
</template>

<script>
export default {
     data: function () {
    return {
      tableData: [
        {
          totalCured: 0, // 全国累计治愈数
          totalDeath: 0, // 全国累计死亡数
          totalIncrease: 0, // 请勿使用
          incDoubtful: 0, // 全国疑似病例,较昨日对比[不用展示]
          childStatistic: "", //地区   国内
          totalDoubtful: 0, //全国疑似数
          time: "", //更新时间
          totalConfirmed: 0, //全国累计确诊病例
          updateTime: "", //更新时间
          dataSource: "", //数据来源
        },
      ],
    },
        created(){
      this.epidemic();  
    },
         methods:{
              epidemic() {
		      this.axios.get("/api/admin/overView").then((data) => {
		        console.log(data.data);
		         this.tableData = data.data.country;
          `主要是这个地方,数据传不到数组中去,因此上面就展示不出来`
          `我是做后端java的前端不挺懂  简单的还是会的,比如上面的数据传递,但是这里为什么出错了,我实在没找到原因`
        // for(let key in data.data){
        //   JSON.parse(data.data.country)
        //     alert(key)
        // }
          //
        //this.tableData.updateTime = this.data.dataSourceUpdateTime.updateTime;
        //this.tableData.dataSource = this.data.dataSourceUpdateTime.dataSource;
        //console.log(this.tableData);
      });
    },
         }
         
}
</script>
后端的json数据
{
	"country": {
      "totalCured": 322732,
      "totalDeath": 24969,
      "totalIncrease": 0,
      "incDoubtful": 0,
      "childStatistic": "全国",
      "totalDoubtful": 0,
      "time": "2022-09-03 18:26:00",
      "totalConfirmed": 6042552
    },
    "dataSourceUpdateTime": {
      "updateTime": "截至 2022.9.3 18:26",
      "dataSource": "各省市地区卫健委"
    }
}
完整返回格式
{
  "flag": true,
  "code": 20000,
  "message": "操作成功",
  "data": {
    "country": {
      "totalCured": 322732,
      "totalDeath": 24969,
      "totalIncrease": 0,
      "incDoubtful": 0,
      "childStatistic": "全国",
      "totalDoubtful": 0,
      "time": "2022-09-03 18:26:00",
      "totalConfirmed": 6042552
    },
    "dataSourceUpdateTime": {
      "updateTime": "截至 2022.9.3 18:26",
      "dataSource": "各省市地区卫健委"
    }
  }
}

帮解答一下,感谢大佬 们

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值