如何在redux中的mapDispatchToProps中访问全局状态?

时间:2017-05-31 18:39:38

标签: javascript redux redux-thunk

我想发送一个操作,用当前登录的用户更新我的应用程序的全局状态。当用户单击按钮时,会触发在mapDispatchToProps中注册的事件处理程序,然后我想调度操作(article.updateAuthor(currentUser))。但是,在mapDispatchToProps中,我无法访问状态以获取当前用户,并且我不想随意将当前已登录的用户传递给组件道具 - 仅传递给上面的click事件,然后将用户数据传递给已分派的操作。

我知道我可以用redux thunk发送一个动作,让我可以访问状态。然而,由于没有进行API调用,因此看起来相当沉重。

之前有没有人遇到过这个问题?

4 个答案:

答案 0 :(得分:6)

react-redux提供的connect函数中,您可以使用四个可选参数:

  • mapStateToProps
  • mapDispatchToProps
  • mergeProps(这个会给你你想要的东西)
  • options

来自mergeProps的文档:

  

如果指定,则传递mapStateToProps()的结果,   mapDispatchToProps()和父道具。平原对象你   从它返回将作为道具传递给包装组件。您   可以指定此函数以基于选择状态的切片   道具,或将动作创作者绑定到道具

中的特定变量

因此,在您的情况下,您将使用mapStateToProps来访问您需要的全局状态的任何部分。结果将作为mergeProps参数传递给stateProps

mergeProps执行您需要对此状态执行的操作时,请使用dispatchProps的结果(或从中删除dispatch)并在所需的组件中返回所需的对象连接到。

答案 1 :(得分:2)

您可以考虑导入商店并使用store.getState(),这样您就可以访问您的" global"存储。

但请注意,如果您使用的是mergeProps,则应该按照@markerikson回答的建议使用connect

  

的getState()

     

返回应用程序的当前状态树。它等于   商店减速机返回的最后一个值。   Source

伪代码:

import store from 'store'
store.getState().yourReducer.user.current

答案 2 :(得分:2)

你不能。故意不允许mapDispatch访问状态,因为您通常使用mapDispatch来创建绑定函数,并且基于状态执行此操作会不断导致在状态更改时重新创建这些函数。 / p>

如果确实想要这样做,您可以使用connect的第三个参数,称为mergeProps,但这通常只能用作最后的手段。

推荐的方法是:

  • mapState中提取相关数据,并让组件调用this.props.someFunction(this.props.someRelatedValue)
  • 使用thunk并访问其中的状态

总的来说,访问thunk中的状态是完全有效且受支持的功能。有些人对是否这样做是一个好主意表示担忧,我在我的博文Idiomatic Redux: Thoughts on Thunks, Sagas, Abstraction, and Reusability中解决了这些问题。

答案 3 :(得分:0)

在mapDispatchToProps中无法访问状态是荒谬的。

Dynadux是redux的替代方法,它很简单,解决了Redux的麻烦。

此外,还可以从减速器中释放补给,而无需Thunk。