使用React-Native和mapStateToProps的Redux

gpminsuk

我已经阅读了这个主题。React中的state和props有什么区别?

它说道具与国家有所不同,理想情况下,道具的组成部分不应更改,而只能由其父组件更改。

但是,react-redux中的mapStateToProps函数将Redux中的状态映射到React组件的props,当Redux状态通过Redux动作更改时,这基本上是在更改React组件的props。

这对我来说没有意义。似乎应该改为mapStateToStates并将Redux状态映射到React组件的状态。

我想念什么吗?

或Drori

它说道具与国家有所不同,理想情况下,道具的组成部分不应更改,而只能由其父组件更改。

这里的状态是指组件的内部状态,组件可以通过进行内部更改.setState()

但是,react-redux中的mapStateToProps函数将Redux中的状态映射到React组件的props,当Redux状态通过Redux动作更改时,这基本上是在更改React组件的props。

这里的状态是指redux存储,即外部状态。react-redux的connect方法创建一个HOC-高阶组件(一个知道商店状态变化的组件)。HOC包装了不知道存储的哑响应组件。使用mapStateToPropsHOC可以从外部状态映射数据,然后通过props将其注入到react组件。

Redux存储中的状态-> HOC中的mapStateToProps->传递给哑组件的道具

因此,HOC是父级,而哑成员是子级。父级向子级组件注入新的props,并且不违反第一个断言“ props不应在其组件中更改,而应仅由其父级组件更改”。


笔记:

  1. 有关高阶组件的更多信息,请参见Dan Abramov的有关Presentational和Container Components的文章

  2. 要了解react-redux connect是如何工作的-在在线免费课程Redux入门中,Dan Abramov展示了如何从头开始建立连接(第22-29节)

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

了解React-Redux和mapStateToProps()

理解 React Redux Reducer 和 MapstateToProps

如何使用React Redux和Jest测试mapStateToProps?

如何在React和Redux中连接mapstatetoprops和mapdispathctoprops

如何使用react-redux与mapStateToProps,MapDispatchToProps和Redux-Router连接

react-redux 4.0:测试mapStateToProps和mapDispatchToProps?

在React-Redux中了解mapStateToProps和mapDispatchToProps

ownProps、mapStateToProps 和 mapDispatchToProps 的 react-redux 流类型定义

React + Redux连接(mapStateToProps)

键入mapStateToProps React Redux

使用React Redux mapStateToProps的可重用组件

React Redux-使用功能组件与useDispatch与类组件和mapStateToProps的混淆

使用React Native和Redux的动画状态管理

使用 react native 和 redux 进行异步调用,thunk

使用React Native,Redux和Navigator进行导航的正确方法

React Redux:即使mapStateToProps为

React / Redux:mapStateToProps()被多次调用

React native、redux 和 axios:UnhandledPromiseRejectionWarning

React-native 和 redux 操作

React-redux存储状态和mapStateToProps状态不同的原因是什么?

React & Redux:即使使用 mapStateToProps,组件状态也不会更新

未使用 mapStateToProps 将 Redux 状态更新为 React 组件

在React-Native应用中,如何使用SwitchNavigator(react-navigator)和react-redux?

使用React-Navigation和Redux的React Native-如何实现全局可用的“注销”按钮

为什么我不能从React-Native Redux中的mapStateToProps访问this.state.props会话数组?

React-Redux的mapStateToProps以意外的方式工作

在React Redux中的mapStateToProps之前调度动作

React-Redux中无效的mapStateToProps参数

React/Redux 异步问题隐藏了 mapStateToProps 数据?