React项目中使用Redux管理异步请求的问题,很复杂的状况,老司机来挑战自己吧!

我这个项目的State管理是这样的:只有数据流相关的state才交给Redux,UI相关的都放在展示型组件中。现在开始写异步接口,遇到一个问题:展示型组件的state改变依赖redux异步请求的结果,例如请求创建一个评论,请求成功,就alert一个东西, 重点是这里的alert代表:必须通过写代码完成的动作,不是显示隐藏弹窗这种UI层的东西。

现在只有这种思路:

把写在展示型组件中的控制UI的state交给Redux管理,但是这样会导致其他控制组件UI的方法重写,会比较麻烦

请老司机指条明路,感激不尽~~

阅读 4.3k
3 个回答

我把这种通知类动作统一放在一个 Notification 组件中,绑定全局 state 中叫做 notification 的一个数组,并有对应的 Action 和 Reducer 搭配,Action 中是 push 和 pop 两个方法,reducer 中管理 notification。
当请求成功时,触发 Action 中的 push 方法,将需要通知的内容 push 到消息队列中,此时由于 Notification 组件通过 mapStateToProps 订阅了全局 state 中 notification 的变化,会触发组件一系列的更新,可以在 componentWillReceiveProps 中获取 notification 中的第一个元素,如果有则 alert,之后再触发 Action 中的 pop 方法,将刚才 alert 过得 msg 从 notification 中清除,以此类推。
可以在 notification 元素中定义更多的内容,比如提示类型,提示组件。

用react-redux的connect生成props

可以看看dvajs,可以降低使用门槛

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题