如何在React导航中的不同嵌套堆栈之间导航-React Native

时间:2020-03-19 16:54:29

标签: reactjs react-native

我是新来的本地人。我一直在使用createStackNavigator来导航整个应用程序。

我创建了许多不同的堆栈。在每个堆栈中,都​​有我的标头代码。我想在每个标题中都具有一个按钮,以便可以导航到另一个屏幕,但是此屏幕在另一个堆栈中。我将如何获得它?

这是我的代码。

export const SearchStack = createStackNavigator({
  Search: {
    screen: SearchScreen
         });


export const HomeStack = createStackNavigator({
  Home:
  {
        screen: HomeScreen,
        navigationOptions: ({ navigation }) => ({
          headerTitle: 'Home',
           headerRight: (
             <Icon name="ios-search" color="#fff" size={30} style={{paddingRight: 20}}
             onPress={() => navigation.navigate('SearchStack', {}, NavigationActions.navigate({ routeName: 'Search'}))} />
            ),
             headerTitleStyle:{
               color: "white",
               alignSelf: "center",
               fontSize: 20        
             }, 
             headerStyle:{
               backgroundColor: "#404042"
            } 
          }),
      },
  Listen: {
    screen: MainScreen,
        navigationOptions: {
          headerTitle: 'Listen',
           headerRight: (
             <Icon name="ios-search" color="#fff" size={30} style={{paddingRight: 20}}
             onPress={() => navigation.navigate('Search')} />
             ),
             headerTitleStyle:{
               color: "white",
               alignSelf: "center",
               fontSize: 20        
             },
             headerStyle:{
               backgroundColor: "#404042"
            } 
           }
          },
       
         },                             
});

1 个答案:

答案 0 :(得分:0)

通常,您可以调用任意一个屏幕,只要它位于堆栈之一即可。