通过 NavigatorIOS 传递 Redux 状态

Posted 2023-04-13

【中文标题】通过 NavigatorIOS 传递 Redux 状态

【英文标题】：Pass Redux state via NavigatorIOS

【发布时间】：2016-05-23 19:53:51

【问题描述】：

我正在将 Redux 集成到 React Native 应用程序中。我无法弄清楚如何通过 Navigatorios 组件传递 Redux 状态。

当执行进入下图组件时，调试器显示

props = Object state: undefined, actions: Object 使用操作对象中的预期操作，并且状态尚未定义，因为它尚未初始化（我假设）。

但是当执行进入 ItemIndex 组件时，调试器显示 props = Object navigator: Object, route: Object

我当前的实现尝试显式传递状态和操作，但它们没有被拉出：调试器现在显示 props = Object navigator: Object, route: Object, state: null, actions: undefined

class MainComponent extends Component 
  constructor(props) 
    super(props) 
    const  actions, state  = props
  

  render() 
    return (
      <NavigatorIOS
        ref = "nav"
        style = styles.navigator
        initialRoute = 
          // Pass redux state into component
          passProps:  state: this.state, actions: this.actions ,  
          // currently becomes  state: null, actions: undefined 
          title: 'Items',
          component: ItemIndex
        /> 
    )
  


module.exports = MainComponent

有没有办法让我继续通过 NavigatorIOS 传递 Redux 状态？

【问题讨论】：

将它们作为props 注入到initialRoute 怎么样？我知道这可能与您的应用程序的结构不符，但这是一种方式。

@NaderDabit 你能举个例子吗？

【参考方案1】：

react-native-navigation 支持 Redux，使用原生 iOS 视图控制器（通过 react-native-controllers 而不是 navigatorIOS）并且很快将支持 android。到目前为止，这是满足我需求的最佳导航解决方案。

【参考方案2】：

我意识到我遗漏了链中的 props 部分：

  render() 
    return (
      <NavigatorIOS
        ref = "nav"
        style = styles.navigator
        initialRoute = 
          // Pass redux state into component
          passProps:  state: this.props.state, actions: this.props.actions ,  
          title: 'Items',
          component: ItemIndex
        /> 
    )
  

实际上 - 这仅适用于初始状态，它似乎停止状态更改触发初始路由组件和后续组件的组件更新。

【讨论】：

没有解决办法？我有一个带有 3 个标签的 。我添加了显示周围的状态以尝试了解问题所在。 标签栏更新。 内的视图更新。唯一不更新的是包含 的 。我可以调用一个动作来改变 的状态，并且除了 视图之外的每个人都会更新。 在使用 passProps 传递 redux 状态时是否不起作用？

总而言之，使用 passProps 将 redux 状态传递给 在状态更改时永远不会更新。其他组件更新正常吗？