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

我在这里使用了光滑的React Navigation并在nested navigation recipe之后，但我不知道如何将'this'传递给我的导航。对不起，我的无知。React Native：将道具传递给嵌套导航

这里是我的总体结构轮廓：

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？

来源

2017-05-19 AlxVallejo

不确定您是否可以按原样传递状态。然而，你通过了PARAMS可以通过下一屏幕如下访问..你可以试试这个

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

来源

2017-05-20 00:06:20

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

来源

2017-05-20 01:10:18

我想我的观点是'const StackNavigation'是在App组件外声明的，所以它没有'this'的上下文，并且这个'不可用 – AlxVallejo

你是对的，我直到现在才意识到。但是......你想做什么？为什么'screenProps'不能解决你的问题？ –

因此，这*起作用*为初始渲染，但我注意到如果这些道具被修改（例如通过修改根组件的状态），子画面不会重新渲染。无论如何强迫导航员更新道具？ –

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

回答

相关问题