身份验证后应在 Flux 应用程序中的何处进行存储重新获取操作？

Posted 2023-02-22

【中文标题】身份验证后应在 Flux 应用程序中的何处进行存储重新获取操作？

【英文标题】：Where should store refetch action be made in Flux app after authentication?

【发布时间】：2015-10-14 01:50:12

【问题描述】：

假设我有Messages、LoginForm 组件、MessageStore 和UserStore（用于保存登录用户信息）。

匿名用户可以查看消息，收藏和其他一些属性仅适用于经过身份验证的用户。

LoginForm 是模态的，当用户登录时，我需要使用包含用户特定属性的消息对象从 MessageStore 的 API 重新加载数据。

我可以在MessageStore中消化LOGIN_SUCCESS（或每个感兴趣的 store) 并在 store 内触发 refetch 操作。 UserStore 之后，我可以从控制器视图中触发重新获取操作 变化。在这种情况下，我需要知道所有应该重新获取的商店 用户登录后。

在助焊剂应用中执行此逻辑的正确方法是什么？

【参考方案1】：

在我制作的使用登录页面然后从 API 获取用户特定事件的应用中，这是我使用的结构：

LoginPage（提交时）-> WebAPIUtils.login（电子邮件，密码） WebAPIUtils.login 联系 API，在响应时 -> actions.receiveLogin(response)

receiveLogin 然后使用登录响应的 actionType 调用调度程序

我的 sessionStore 监听调度，并在它的 switch 语句中为登录响应的情况设置商店中的用户信息以及 sessionStorage。然后它调用 WebAPIUtils.getEvents()

WebAPIUtils.getEvents() 然后从 API 请求用户的事件，收到后它会分派一个 receiveEvents 操作，我的主商店会侦听该操作并相应地更新商店中的事件。

我的组件监听主存储中的变化，当事件在 getEvents() 之后更新时，它会触发重新渲染。

你可以在这里找到代码：https://github.com/hilary-L/react-cal-with-api