Question

我正在使用光滑的React Navigation并在此处nested navigation recipe之后，但我不知道如何通过这个＆＃39;这个＆＃39;到我的导航。对不起我的无知。

这是我的一般结构大纲：

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

根据this，您可以将额外选项传递给StackNavigatorConfig中的StackNavigator。像这样：

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访问两者（初始屏幕和任何其他屏幕）的参数。

Answer 2

不确定您是否可以按原样传递状态。但是你传递的参数可以在下一个屏幕上访问，如下所示..你可以试试这个

  this.props.navigation.state.params.<<property passes>>

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

2 个答案: