数据格式的处理 echarts数据改为 Table表格格式的数据

 

 

前景

  后端返回的 echarts 展示数据格式,既要展示echarts 又要展示table表格,echarts 的数据格式为下面

  

{
xData: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
yData1:[10, 52, 200, 334, 390, 330, 220],
yData2: [120, 200, 150, 80, 70, 110, 130],
yData3:['a','b','c','d','e','f','g']

}

 

table数据格式为下面

tableData: [{
          xData: 'Mon',
          yData1: '10',
          yData2: '120',
          yData3:'a'
        }, {
           xData: 'Tue',
          yData1: '王52',
          yData2: '200',
           yData3:'b'
        }, {
          xData: 'Wed',
          yData1: '200',
          yData2: '150',
           yData3:'c'
        },
       .....
]        

 

方法:

   testData(data) {
            return data.xData.map((item, index) => {
                const resultObj = {};
                Object.keys(data).forEach(key => {
                    if (data[key]?.length) {
                        resultObj[key] = data[key][index];
                    }
                });
                return resultObj;
            });
        }



调用的时候 this.testData(res.data) //res.data 的格式为代码1中,  this.testData(res.data)得到代码2中的格式

 

posted @ 2023-08-04 10:58  Qing`ing  阅读(429)  评论(0编辑  收藏  举报