首页 > 解决方案 > 在 ReactJS 中按预期转换 JSON 数据响应

问题描述

var mydata = [
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul1: 1004
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul2: 1234
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul3: 1034
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul4: 1204
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul5: 2234
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul6: 2234
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul7: 2034
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul8: 2412
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul9: 2502
  },
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul10: 1122
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul1: 1034
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul2: 1304
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul3: 1230
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul4: 2234
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul5: 2234
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul6: 2224
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul7: 2232
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul8: 1434
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul9: 1244
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul10: 1234
  }
];

可以将上面的 JSON 转换为下面的 JSON 吗?来自后端响应数据的 JSON 以上数据。必须转换为如下 JSON

var dataneeded = [
  {
    source: 11,
    Registernumber: ">RT-113, <RT-333",
    jul1: 1004,
    jul2: 1234,
    jul3: 1034,
    jul4: 1204,
    jul5: 2234,
    jul6: 2234,
    jul7: 2034,
    jul8: 2412,
    jul9: 2502,
    jul10: 1122
  },
  {
    source: 12,
    Registernumber: ">GF-103, <GF-303",
    jul1: 1034,
    jul2: 1304,
    jul3: 1230,
    jul4: 2234,
    jul5: 2234,
    jul6: 2224,
    jul7: 2232,
    jul8: 1434,
    jul9: 1244,
    jul10: 1234
  }
];

我正在为我的应用程序使用 react-Redux 作为框架,“mydata”是来自后端的响应。我需要按日期更改。需要用“source”和“Registernumber”分开是可能的吗?

标签: javascriptarraysreactjsreact-redux

解决方案


您可以使用减少:

Object.values(
  mydata.reduce((result, item) => {
    result[item.source] = {//group by source property
      ...result[item.source],//merge items with same source
      ...item,
    };
    return result;
  }, {})
);

工作片段:

const mydata = [
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul1: 1004,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul2: 1234,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul3: 1034,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul4: 1204,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul5: 2234,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul6: 2234,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul7: 2034,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul8: 2412,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul9: 2502,
  },
  {
    source: 11,
    Registernumber: '>RT-113, <RT-333',
    jul10: 1122,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul1: 1034,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul2: 1304,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul3: 1230,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul4: 2234,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul5: 2234,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul6: 2224,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul7: 2232,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul8: 1434,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul9: 1244,
  },
  {
    source: 12,
    Registernumber: '>GF-103, <GF-303',
    jul10: 1234,
  },
];
const result = Object.values(
  mydata.reduce((result, item) => {
    result[item.source] = {
      ...result[item.source],
      ...item,
    };
    return result;
  }, {})
);

console.log(result);


推荐阅读