如何在React JS中访问全局（window.）变量

Question

我正在使用React JS。我有一个登录页面，该页面从终端点作为响应接收数据。我将响应中的不同组件存储在window变量中，因为它们必须在不同的组件中访问。但是，这仅在加载新组件时起作用，在刷新后，window变量就会变为空。

这是我的登录组件：

handleSubmit(event) {
event.preventDefault()

axios
  .post("EDN POINT LINK",
    {
      email: this.state.email,
      password: this.state.password

    })
  .then((response) => {

    console.log(response);

    // STORING ID
    window.id = window.responseDetails.map(
      mID => mID.id
    )
    console.log('ID is: ' + window.id);

    // STORING TOKEN
    window.token = window.responseDetails.map(
      mToken => mToken.token
    )
    console.log('TOKEN is: ' + window.token);

    // STORING ERROR
    window.error = window.responseDetails.map(
      mError => mError.error
    )
    console.log('ERROR is: ' + window.error);

这是一个组件，我可以在其中访问 window 变量：

 render() {

    console.log(window.id)
    return (

    )
}

如果我有更多时间，我会实现类似于Redux或Context的东西，但不幸的是我太新了解React JS了。

- Ankul

---

放心使用上下文（相信我，比你想象的容易）或提升状态。如果重新加载页面，window 不会保留您的数据。 - Max

Answer 1

请不要在窗口中存储持久数据！

窗口是全局的，但其范围与页面加载有关。

为了具有一致的数据，您应考虑使用localStorage、sessionStorage和cookies等持久存储。

点击此处查看更多示例 什么是localStorage、sessionStorage、session和cookies之间的区别？

- Antonio Giordano

---

是的，现在它有意义了。谢谢你的回答。 - Ankul

没问题，放心投票给答案如果你觉得合适。 - Antonio Giordano

关于如何在ReactJS中访问窗口变量的问题。我建议尝试回答并警告其使用。 - Dlaugh14