Javascript 在React'中获取Get请求；无法读取属性'；未定义的地图'；

我正在尝试在React中发出获取请求。我是新手，在理解响应结构方面有点困难。我目前正在用这段代码访问一个服务器，并试图将其放入一个表中。但我一直收到错误

未处理的拒绝（TypeError）：无法读取未定义的属性“map”

。谁能告诉我哪里出了问题，或者该怎么办

const [rowData, setRowData] = useState([]);

  const columns = [
    { headerName: "Stock", field: "name"}, 
    { headerName: "Symbol", field: "symbol" }, 
    { headerName: "Industry ", field: "industry" }
  ];

useEffect(() => {
    fetch("PRIVATE SERVER")
    .then(res => res.json())
    .then(json => console.log(json))
    .then(data => 
      data.map(stocks => {
        return {
          name: stocks.name,
          symbol: stocks.symbol,
          industry: stocks.industry,
        };
      })
    )
    .then(stocks => setRowData(stocks));
  }, []);

这是一个来自服务器的JSON响应的示例：

[
  {
    "name": "Agilent Technologies Inc",
    "symbol": "A",
    "industry": "Health Care"
  },
  {
    "name": "American Airlines Group",
    "symbol": "AAL",
    "industry": "Industrials"
  }
]

---

问题实际上在于你对then的使用。您应该尝试在代码上使用不同的方法

比如说

  const [rowData, setRowData] = useState([]);

  const columns = [
    { headerName: "Stock", field: "name"}, 
    { headerName: "Symbol", field: "symbol" }, 
    { headerName: "Industry ", field: "industry" }
  ];

useEffect(() => {
    fetch("PRIVATE SERVER")
    .then(res => res.json()
       .then(json => {
          console.log(json);
          const newRowData = json.map(stocks => {
             return {
                name: stocks.name,
                symbol: stocks.symbol,
                industry: stocks.industry,
             };
          });
          setRowData(newRowData);
       }));

但是为了代码可读性，我建议您尝试使用async Wait

const [rowData, setRowData] = useState([]);

  const columns = [
    { headerName: "Stock", field: "name"}, 
    { headerName: "Symbol", field: "symbol" }, 
    { headerName: "Industry ", field: "industry" }
  ];

useEffect(() => {
   async function doFetch() {
      const fetchResponse = await fetch('PRIVATE SERVER', { method: 'GET' });
      if (response.status !== 200) // do something

      // extract the json string to json object
      const data = await fetchResponse.json();

      const newRowData = data.map(stocks => ({
         name: stocks.name,
         symbol: stocks.symbol,
         industry: stocks.industry,
      }));

      setRowData(newDataRow);
   }

。然后（json=>console.log（json））

将

未定义的
传递到下一个
。然后
。。。因为这就是console.log返回的结果-要么在最后一个.then中执行console.log，要么，如果必须，可以执行
。然后（json=>（console.log（json），json））