怎么把后端返回的数据更改到前端需要的样式

能把arr 变成arr1这样的么 src是图片路径(要对比2023-03-06和2023-03-05的产量和能耗的数据比对 增长了就是up,降低了就是down) class是类名 name是一个产量一个能耗的,num是对应的数据 unit是写死的单位

      let arr = [
        { DATE: "2023-03-05", NAME: "炼钢厂产量", VALUE: 10458.0 },
        { DATE: "2023-03-05", NAME: "轧钢厂产量", VALUE: 9982.0 },
        { DATE: "2023-03-05", NAME: "烧结成品矿产量", VALUE: 18421.0 },
        { DATE: "2023-03-05", NAME: "炼铁厂铁水产量", VALUE: 10085.0 },
        { DATE: "2023-03-05", NAME: "烧结工序能耗", VALUE: 15.068 },
        { DATE: "2023-03-05", NAME: "炼铁工序能耗", VALUE: 722.841 },
        { DATE: "2023-03-05", NAME: "炼钢工序能耗", VALUE: 15.68 },
        { DATE: "2023-03-05", NAME: "轧钢工序能耗", VALUE: 246.431 },
        { DATE: "2023-03-06", NAME: "烧结工序能耗", VALUE: 0.0 },
        { DATE: "2023-03-06", NAME: "炼铁工序能耗", VALUE: 0.0 },
        { DATE: "2023-03-06", NAME: "炼钢工序能耗", VALUE: 0.0 },
        { DATE: "2023-03-06", NAME: "轧钢工序能耗", VALUE: 0.0 },
      ];
  let arr1 = [
                {src:UpImg,class:'Up',name:'产量',num:'8.88',unit:'t'},
                {src:DownImg,class:'Down',name:'能耗',num:'8.88',unit:'kgce/t'},
    ]

“Devil组”引证GPT后的撰写:

  • 按照DATE和NAME进行分组,统计出每个分组的第一个值和最后一个值。

  • 比较第一个值和最后一个值的大小,确定是up还是down。

  • 将结果存储到一个新数组中,格式符合arr1的要求。

let UpImg = 'up.png';
let DownImg = 'down.png';

let groupedData = arr.reduce((acc, curr) => {
  let key = curr.DATE + curr.NAME;
  if (!acc[key]) {
    acc[key] = { DATE: curr.DATE, NAME: curr.NAME, first: curr.VALUE, last: curr.VALUE };
  } else {
    acc[key].last = curr.VALUE;
  }
  return acc;
}, {});

let arr1 = Object.values(groupedData).map((data) => {
  let direction = data.first <= data.last ? 'Up' : 'Down';
  let name = data.NAME === '烧结成品矿产量' ? '烧结成品矿' : data.NAME.substring(0, 2);
  let unit = data.NAME.includes('能耗') ? 'kgce/t' : 't';
  return {
    src: direction === 'Up' ? UpImg : DownImg,
    class: direction,
    name: name,
    num: (data.last - data.first).toFixed(2),
    unit: unit,
  };
});


在这个实现中,用了reduce函数来对arr进行分组操作,并存储每个分组的第一个值和最后一个值。然后,遍历分组后的数据,比较第一个值和最后一个值的大小,确定是up还是down,最后将结果存储到一个新数组中。在处理name和unit时,根据数据的具体内容来进行特殊处理。