React Native：将道具传递给嵌套导航

Question

我正在使用光滑的React Navigation并遵循此处的嵌套导航配方，但是我不知道如何将“ this”传递给我的导航。对不起，对不起。

这是我的一般结构概述：

class MyApp extends Component {
  render() {
    return (
      <StackNavigation
        screenProps={this.state}
      />
    )
  }
}

const MainScreenNavigator = TabNavigator(
  {
    Awesome: { screen: Awesome } // How do I pass this.state?
  }
)

const routesConfig = {
  Home: { screen: MainScreenNavigator },
  Profile: { screen: Profile }
}

const StackNavigation = StackNavigator(routesConfig, {initialRouteName: 'Home'})

那么如何将this.state传递给MainScreenNavigator？

Answer 1

根据这个，你可以通过一个额外的选项，在该StackNavigator StackNavigatorConfig。像这样：

const StackNavigation = StackNavigator(routesConfig, StackNavigatorConfig)

...其中的StackNavigatorConfig对象是：

{ initialRouteName: 'Home', initialRouteParams: {...this.state} }

这将把您的所有状态传递到导航器的初始路径。

对于其他任何路线，您都可以执行以下操作：

this.props.navigation.navigate('SomeScreen', {<the-greatest-object-for-pass-down>})

那就是将最大的对象传递给SomeScreen。

最后，您可以使用来访问两个参数（初始屏幕和任何其他屏幕）this.props.navigation.params。