如何从嵌套的对象数组中获取值-- React

Question

我正在尝试从由对象数组组成的data.json中获得值。我试图通过对json数据使用map方法来获取值。我的Json dat结构类似于Array->Object->Array-Object([{{}}])。这就是Json中数据的结构方式。我已经记录了Json数据和逻辑以获得值。每当我试图从(对象的内部数组)获取值时，我都会得到未定义的值。任何人都可以帮助我解决这个问题。提前感谢！

[
  {
    "key": "row-0",

    "cells": [
      {
        "key": "cell-0",
        "id": "ID-0",
        "headerName": "Name",
        "CustomerName": "ABC"
      },

      {
        "key": "cell-1",
        "id": "ID-1",
        "headerName": "RegID",
        "CustomerID": "P-01"
      },

      {
        "key": "cell-2",
        "id": "ID-2",
        "headerName": "Detail",
        "Deatil": "Abc"
      }
    ]
  },

  {
    "key": "row-1",

    "cells": [
      {
        "key": "cell-1",
        "id": "ID-1",
        "headerName": "Name",
        "CustomerName": "CDE"
      },

      {
        "key": "cell-2",
        "id": "ID-2",
        "headerName": "RegID",
        "CustomerID": "P-02"
      },

      {
        "key": "cell-3",
        "id": "ID-3",
        "headerName": "Detail",
        "Deatil": "CDE"
      }
    ]
  }
]

//逻辑

{mockData.map((values, index) => {
        console.log("VALUES", values);
        return values.cells.map(({ headerName, ...rest }) => {
          console.log("JSON", JSON.stringify(rest));
          console.log("REST", rest.CustomerName);---> getting undefined(I tried many approach everything is giving me undefined)
        });
      })}

Answer 1

我已经为你树立了一个榜样

如上文所述..。没有customerName的元素将提供未定义的元素。

​

let mockData = [{
    "key": "row-0",

    "cells": [{
        "key": "cell-0",
        "id": "ID-0",
        "headerName": "Name",
        "CustomerName": "ABC"
      },

      {
        "key": "cell-1",
        "id": "ID-1",
        "headerName": "RegID",
        "CustomerID": "P-01"
      },

      {
        "key": "cell-2",
        "id": "ID-2",
        "headerName": "Detail",
        "Deatil": "Abc"
      }
    ]
  },

  {
    "key": "row-1",

    "cells": [{
        "key": "cell-1",
        "id": "ID-1",
        "headerName": "Name",
        "CustomerName": "CDE"
      },

      {
        "key": "cell-2",
        "id": "ID-2",
        "headerName": "RegID",
        "CustomerID": "P-02"
      },

      {
        "key": "cell-3",
        "id": "ID-3",
        "headerName": "Detail",
        "Deatil": "CDE"
      }
    ]
  }
];


mockData.map((values, index) => {
  console.log("VALUES", values);
  return values.cells.map(({
    headerName,
    ...rest
  }) => {
    console.log("JSON",rest);
    console.log("Key:", rest.key);
    console.log("ID:", rest.id);
    console.log("CustomerName:", rest.CustomerName ? rest.CustomerName : 'NA' );
    
  });
})

​