如何在Rekit功能之间共享状态?

时间:2018-05-28 15:07:13

标签: reactjs react-redux

我正在使用Rekit,并且完全喜欢它,它使学习React和Redux的任务变得更加容易,但是它对如何构建事物的略微看法使我想知道什么是最佳实践在应用程序的2个不同功能之间共享状态(例如,登录用户,以及其他一些数据)。

我可以去localStorage,但这似乎与Redux成为真理来源的想法相违背。

任何帮助表示感谢。

1 个答案:

答案 0 :(得分:0)

这不是Rekit问题,您的问题实际上是Redux问题。

功能组件是Redux连接的组件,这意味着在组件文件的最底部,您将找到类似这样的内容:

export default connect(mapStateToProps, mapDispatchToProps)(DefaultPage)

connect的第一个参数是mapStateToProps,这是您要查看的函数,因为它允许您访问整个Redux存储并获取一些值,这些值将作为组件的属性(this.props)。

Rekit会为您在组件中添加此方法,但是默认情况下,它仅 导入组件的存储数据。 您需要添加要访问的其他功能状态。

例如,我在LoginPage功能中有一个Users组件。 LoginPage组件的mapStateToProps函数是这样的:

function mapStateToProps(state) {
  return {
    users: state.users,
  }
}

如您所见,该函数获取作为参数传递的全局Redux state对象,并且该函数获取state.users并将其分配为名为users的prop(此函数的返回的值会按照其名称说明翻译为props

仅供参考:在users文件中定义了州的Others/common/rootReducer.js,以便Redux知道它。

现在,假设您具有Config的Rekit功能,那么state.config将包含该功能中的所有definef状态。 为了访问其状态,您必须添加config: state.config,然后配置状态才能在组件的this.props中使用:

function mapStateToProps(state) {
  return {
    config: state.config,
    users: state.users,
  }
}

例如,假设Config功能为signUpOpen定义了一个true状态键,并且您想从LoginPage组件中检查它。注册是开放的。

使用该代码,在LoginPage组件render()中,我可以访问this.props.signUpOpen

如果您需要更多信息,请检查the Redux documentation