将从后台获取的多个一维数组对象转化为一个二维数组

前端往往要需要根据后端传过来的数据做一定的处理来为前端展示

前端需要的数组形式为:

arr = [

[ "2021-12-01",92.76,"AQ"],

[ "2021-12-02",95.76,"AQ"],

[ "2021-12-03",91.76,"AQ"],

[ "2021-12-04",97.76,"AQ"],

...

[ "2021-12-01",97.76,"FU"],

[ "2021-12-02",95.76,"FU"],

[ "2021-12-03",91.76,"FU"],

[ "2021-12-04",97.76,"FU"],

...

[ "2021-12-01",97.76,"XL"],

[ "2021-12-02",95.76,"XL"],

[ "2021-12-03",91.76,"XL"],

[ "2021-12-04",97.76,"XL"],

...

[ "2021-12-01",97.76,"GL"],

[ "2021-12-02",95.76,"GL"],

[ "2021-12-03",91.76,"GL"],

[ "2021-12-04",97.76,"GL"],

..

]

后台获取的四个数组数据如下
响应示例

{
    "code": 200,
    "data":
    [
        {
            "date":"2021-12-01",
            "socre":92.76
        },
        {
            "date":"2021-12-02",
            "socre":95.76
        },
        { 
            "date":"2021-12-03",
            "socre":91.76
        },
        {
            "date":"2021-12-04",
            "socre":97.76
        },
        ...
    ]
}

 

data(){
    return{
        fourScoreData:[],
    }
}
methods:{
    async initData(){
       //AQ
      const { data: safetyScreData } = await getScoreData({
        score_type: 1,
      });

      //定义两个数组,分别获取安全的date和分数,
      var safetyDateArr = [];
      var safetyScoreArr = [];
      for (var i = 0; i < safetyScreData.length; i++) {
        safetyDateArr.push(safetyScreData[i].date);
        safetyScoreArr.push(safetyScreData[i].score.toFixed(2));//并保留两位小数
      }

      //定义一个二维数组,用于存放安全的数组[["时间",分数,"安全"]]
      var safetyArr = [[]];
      // 循环将一维数组中的时间和分数存入safetyArr中
      for (var i = 0; i < safetyDateArr.length; i++) {
        //这句话是必须的，每次都要新建一个一维数组,不然会报错
        safetyArr[i] = new Array();
        safetyArr[i][0] = safetyDateArr[i];
        safetyArr[i][1] = safetyScoreArr[i];
        safetyArr[i][2] = "安全";//可判断score_type来设定值
      }

        //其他三组数据同理



        //合并四组数据

    var fourData = [];
      //将四个二维数组中的数组元素拿出来放入前端所需的fourScoreData数组中中,即合并这四个数组
      this.fourScoreData = fourData.concat(
        safetyArr,
        serviceArr,
        efficiencyArr,
        managementArr
      );

}

}