Flux 和 React JS 中的依赖动作

Posted 2023-02-22

【中文标题】Flux 和 React JS 中的依赖动作

【英文标题】：Dependent Actions in Flux and React JS

【发布时间】：2015-04-24 02:00:42

【问题描述】：

我目前在我们的 Flux 应用程序中遇到问题，其中组件需要首先获取当前用户，并且，当且仅当当前用户被获取时，使用不同的 Ajax 调用获取该用户的通知，如下所示：

_onCurrentUserChange: function() 
  this.setState(getStateFromStores());
  NotificationsActionCreator.getNotifications();
,

如您所见，在我们知道 currentUser 已更改后，我正在尝试将操作发送到 getNotifications。

但是，Flux 不允许多次分派操作，我们决定所有服务器请求都应通过操作分派。

因此，我无法等待 currentUser 被接收，然后调度操作以获取通知。

正确的 Flux 方法是什么？

【参考方案1】：

所以我想我会发布我修复此问题的方式以供其他人查看。

基本上，我们最终在 WebApiUtils 模块中创建了一个函数，该函数对 getCurrentUser 和 getNotificationsForCurrentUser 后端路由进行顺序 Ajax 调用。然后，我们调度一个包含 currentUser 和通知的操作。 currentUser 和 notification 存储都监听这个事件，并各自获取它需要的数据。

如果您想查看此代码，请查看： https://github.com/krazemon/repcoin/blob/master/js/api.js#L16 https://github.com/krazemon/repcoin/blob/master/js/stores/AuthStore.js#L59 https://github.com/krazemon/repcoin/blob/master/js/stores/NotificationsStore.js#L59-L62

我选择了这个解决方案，因为它不违反我们商店的同步属性，并且允许我们避免级联调度。

【讨论】：

我刚刚遇到了一个类似的问题，我正在添加一个项目（ajax 调用 1），然后获取包含所有项目的整个列表，包括一个新添加的项目（ajax 调用 2）。我决定也像你一样在 api 中解决这个问题。感谢您发布指向源代码的链接。

没问题。很高兴这对您有所帮助。