React - 如何在类中存储全局变量（例如，User.username）

Question

所以，我已经创建了一个带有登录的反应应用程序，它正在向本地烧瓶服务器发送ajax请求，该服务器将{token:TOKEN, user:{username:USERNAME,email:EMAIL}}作为JSON返回。

但是，由于我的反应应用程序将有多个页面，我使用的是ReactRouter，但我无法在多个{{1}中找出如何全局访问User.username变量等变量实例。

请记住，我正在做所有这个客户端（直到我开始反应服务器端渲染）

目前，我在React.createClass({})中存储了这些类型的变量，但这意味着它们不会在UI中自动更新，无需更改网址或刷新。

localStorage

但我希望能做的是

const Admin = (props) => (
    <div>
        <h2>Admin</h2>
        <p>Welcome, {localStorage.username}</p>
        {props.children}
    </div>
)

路线

const Admin = (props) => (
    <div>
        <h2>Admin</h2>
        <p>Welcome, {User.username}</p>
        {props.children}
    </div>
)

Answer 1

如果您需要在组件之间共享多个数据，则应选择常见的商店模型，即Redux或Flux。

因此，您可以将其存储在Redux存储中并从那里访问，而不是通过存储在localStorage中来共享数据。

Here 是一个很好的教程