【数据处理】我这个后端要处理前端的问题,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-linev-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": "各省市地区卫健委"
    }
  }
}

帮解答一下,感谢大佬 们

你可能感兴趣的:(笔记,求解问题,前端,json,javascript)