如何从 useEffect 读取更新为 useState 的数据？答案

【问题标题】：How can I read data updated to useState from a useEffect?如何从 useEffect 读取更新为 useState 的数据？
【发布时间】：2021-09-28 19:22:11
【问题描述】：

我见过与此类似的问题，但没有一个回答我的问题。对于代码，就是这样。

  const [raceData, updateRaceData] = useState();
  const [raceChosen, updateRaceChosen] = useState();

  const url = "http://localhost:5000/races/viewraces";

  useEffect(() => {
    Axios.get(url)
      .then((response) => {
        const allRaces = response.data.races;
        updateRaceData(allRaces);
      })
      .catch((error) => console.error(`Error: ${error}`));
  }, []);


  console.log(raceData[0]);

因此，当我使用 console.log() raceData 和 raceData[0] 或 raceData1 时，它可以工作并且不会给我带来任何麻烦。但如果我改为 console.log(raceData[0].race)，然后刷新，它开始告诉我：

TypeError: Cannot read properties of undefined (reading 'race')

任何帮助找出为什么尝试从我收到的响应中访问内容不能完全起作用的任何帮助。

编辑： 这是带有raceData[1]的对象响应： Response object

【问题讨论】：

标签： javascript reactjs ajax get

【解决方案1】：

尝试像这样映射比赛数据：

raceData?.map((race) => console.log(race))

这应该会填充您的raceData 信息

【讨论】：

所以说实话，这不是我想做的，但它确实让我意识到我做错了什么，所以谢谢你的记忆震动。

【解决方案2】：

在分配变量之前，浏览器正在运行 console.log(raceData[0])。尝试raceData && console.log(raceData[0]);，它只会在分配了raceData 的情况下执行console.log()。

【讨论】：