javascript - ReactJS:使用 JSX 进行数据转换

Question

我正在尝试在 React 应用程序中使用 JSX 转换数据，但我什至难以弄清楚这样做的步骤。

输入:

const csvData =[
  ['title', 'A', 'B'] ,
  ['E01', 1 , 0] ,
  ['E02', 5 , 0] ,
  ['E03', 10, 2]
];

期望的输出:

const jsonData = 
{
    "A": 
      {
        "E01": 1,
        "E02": 5,
        "E03": 10
      },

    "B": 
      {
        "E01": 0,
        "E02": 0,
        "E03": 2
      }

}

我的失败尝试...

1. 遍历嵌套数组中的每个数组(除了第一个包含标题的数组)

2. 创建嵌套循环以遍历数组中的每个项目。

3. 在这个嵌套循环中，创建一个字典来存储标题，每个数组中的第一项。利用 header 的索引提取数组中后续项的值。

   export function transformData(data) {
   
      let dict = [];
   
      // array of header labels
      const arr = data[0];
   
      // Looping through each row
      for (var i=1; i<data.length; i++) {
   
       // Create a dictionary by iterating through each header label, then extracting title and its value
       arr.map((f) => dict.push(
         {key: f,
          value: {key: data[i][0], value: data[i][f]}
         }))
   
     }
   
   console.log(dict);
   
   };
   

控制台打印的结果:

0:
key:"title"
value:{key: "E01", value: undefined}

1:
key:"A"
value:{key: "E01", value: undefined}

2:
key:"B"
value:{key: "E01", value: undefined}

3:{key: "title", value: {…}} // header labels are repeated..
4:{key: "A", value: {…}}
5:{key: "B", value: {…}}
6:{key: "title", value: {…}}
7:{key: "A", value: {…}}
8:{key: "B", value: {…}}

Answer 1

您可以使用嵌套的 for 循环来实现结果:

var arr = [
  ['title', 'A', 'B'] ,
  ['E01', 1 , 0] ,
  ['E02', 5 , 0] ,
  ['E03', 10, 2]
];

var obj = {};
 for(var i = 1; i < arr[0].length; i++){
    obj[arr[0][i]] = {};
    for(var j = 1; j < arr.length; j++){
      obj[arr[0][i]][arr[j][0]] = arr[j][i];
    }
 }
 
 console.log(obj);