Question

               name            city  phone-number        date
0      Ronald Reyes  South Oroville  631-367-2892  1984-04-14
1      Scott Nguyen       Glenmoore  350-506-1497  1978-11-18
2     Joseph Rogers     Cherry Tree  315-937-6733  2012-11-13
3  Alisha Whitehead            Iola  870-884-0471  1998-02-04
4  Christopher Cook       Liverpool  370-595-5729  2017-10-30

我在Home Stack中有一个搜索组件...而且在Discover中有一个搜索按钮，它带我在Home Stack中搜索组件但是当我使用<NavigationContainer> <Tabs.Navigator> <Tabs.Screen name="Home" component={HomeStack} /> <Tabs.Screen name="Discover" component={Discover} /> </Tabs.Navigator> </NavigationContainer>时，它带我到了home组件，而不是发现该组件 HomeStack中的Stack导航器是这样的：

navigator.back()

我希望返回按钮将我带到最后一个屏幕，而不是该堆栈的根屏幕

Answer 1

如果您执行以下操作，它将可以很好地工作并且更易于组织。

首先，您将在主js文件中创建StackNavigator，在此示例中为App.js。您还将创建一个文件夹来存储屏幕（在这种情况下，我将称为src）

App.js将如下所示：

import HomeScreen from '../src/screens/HomeScreen .js // importing screens
import SearchScreen from '../src/screens/SearchScreen.js
.
.
.

const navigator = createStackNavigator(
    {
        Screen1Ref: HomeScreen,
        Screen2Ref: SearchScreen ,
        .
        .
        .
    },
    {
        initialRouteName: 'HomeScreen ',
        defaultNavigationOptions: {
            title: 'name',
        },
    }
);

export default createAppContainer(navigator);

第二，您将创建屏幕并export default创建每个屏幕，并将其导入到App.js文件中，在该文件中将列出屏幕（导入并接收一个键），然后将创建您的导航器。

在屏幕内部，您将使用navigation.navigate('key')导航到任何屏幕。参见示例：

const ScreeExample = ({navigation}) => {
     return (
          <Text>Testing</Test>
          navigation.navigate('Screen1Ref')
     )
}
export default ScreenExample

这是我可以推荐给您的一种更简便的方法，同时也可以使用该按钮返回上一屏幕。

如何在React Navigation 5的标签导航器中的标签屏幕之间移动？

1 个答案: