【问题标题】：ReactJS Tutorial Problems: TypeError: Cannot read property 'map' of undefinedReactJS 教程问题：TypeError: Cannot read property 'map' of undefined
【发布时间】：2020-01-13 01:44:22
【问题描述】：

我正在尝试为 nba 球员统计数据提取一些数据，但我不断收到“无法读取未定义的属性 'map'”错误，我不明白为什么。我以同样的方式完成了一个类似的教程并且没有任何问题，所以我很困惑。代码如下：

function App() {


const [player, setPlayer] = useState([]);
  const [team, setTeam] = useState([]);
  const [loading, setLoading] = useState(true);



useEffect(() => {
    async function fetchStats() {
      let res = await fetch(`https://free-nba.p.rapidapi.com/stats/?format=json`, 
      {
        "method": "GET", 
        "headers": {
          "x-rapidapi-host": "free-nba.p.rapidapi.com",
          "x-rapidapi-key": "b9c32f403bmshdcd37fd74ccc767p1748b9jsn94ae938ec129"
        }
      });
      let data = await res.json();
      setPlayer(data.results);
      setLoading(false);

    }
fetchStats();
}, []);

return ( //Added where I'm calling Players 
    <>
      <Router> 
        <Navbar />
        <Container>
          {loading ? (
            <Dimmer active inverted>
              <Loader inverted>Loading</Loader>
            </Dimmer>
          ) : (
            <Switch>
              <Route exact path='/player'>
                <Players data={player} />
              </Route>
              <Route exact path='/team'>
                <Teams data={team} />
              </Route>
            </Switch>
          )}
        </Container>
      </Router>


    </>
  );
}

导出默认函数 Players({ data }) { 返回（

玩家

{data.map((player, i) => { //这是我得到错误的地方 返回（ {player.first_name} 身高

{player.height_feet}

位置

{player.position}

) })} )

【问题讨论】：

<Players> 来自哪里？
您传递给 Players 的数据是未定义的。我认为这是因为data.results 不存在。如果您在使用 Players 组件的地方添加代码，我们或许可以为您提供更好的帮助。
您提供的代码在语法上无效（这会阻止我们重现类型错误）。我们是否有可能在这里查看两个文件并且App 已正确关闭？我希望大多数教程都会有 App 渲染一些 JSX。您能否提供您正在使用的教程？
我在使用 Players 组件的地方添加了
这是我从中学到的教程：youtu.be/EC5ZvP87P2k

标签： reactjs typeerror

【解决方案1】：

我知道出了什么问题。 API 正在从名为 data 的数组返回数据。

所以我不得不使用 setPlayer(data.data) 而不是 setPlayer(data.results)

【讨论】：