Stack nested inside Material Bottom Tab 第二次导航时不显示内容（React Navigation v6）

Question

问题：

当我第一次导航到 Material 底部的堆栈时，一切正常，之后您更改选项卡，当您 return 内容不再呈现时。

预期行为：

每次 select 必须呈现 Stack 的选项卡。换句话说，每次导航到Tab时，我都能看到Tab中Stack的内容。

package	version
@react-navigation/native	6.0.6
@react-navigation/material-bottom-tabs	6.0.9
@react-navigation/native-stack	6.2.5
react-native-safe-area-context	3.3.2
react-native-screens	3.8.0
react-native	0.64.2
expo	43.0.0

Answer 1

遇到了同样的问题。

在此处找到解决方案：https://github.com/software-mansion/react-native-screens/issues/1197#issuecomment-993682256

您应该使用具有 collapsable false 的 View 包裹您的嵌套导航器。我的代码示例：

const MealsNavigator = () => (
    <NavigationContainer>
        <TabNavigator />
    </NavigationContainer>
)

const TabNavigator = () => (
    <Tab.Navigator initialRouteName="Meals" {...TabProps} >
        <Tab.Screen name="Meals" component={StackNavigator} options={{ headerShown: false, tabBarIcon: ({ color }) => (<Ionicons name='ios-restaurant' size={24} color={color} />), tabBarColor: Colors.primaryColor }} />
        <Tab.Screen name="Favorites" component={FavoritesScreen} options={{ tabBarIcon: ({ color }) => (<Ionicons name='ios-star' size={24} color={color} />), tabBarLabel: 'Favorites!', tabBarColor: Colors.accentColor }} />
    </Tab.Navigator>
)

const StackNavigator = () => (
    <View style={{ flex: 1 }} collapsable={false}>
        <Stack.Navigator initialRouteName="Categories" screenOptions={{
            headerStyle: { backgroundColor: Platform.OS === "android" ? Colors.primaryColor : '' }, headerTintColor: Platform.OS === "android" ? 'white' : Colors.primaryColor
        }} >
            <Stack.Screen name="Categories" component={CategoriesScreen} options={{ title: 'Meal Categories' }} />
            <Stack.Screen name="CategoryMeals" component={CategoryMealsScreen} options={({ route }) => ({ title: route.params.title })} />
            <Stack.Screen name="MealDetail" component={MealDetailScreen} options={({ route }) => ({ title: route.params.title })} />
        </Stack.Navigator>
    </View>
)

Stack nested inside Material Bottom Tab 第二次导航时不显示内容（React Navigation v6）

Stack nested inside Material Bottom Tab dont show the content when you navigate the second time (React Navigation v6)

react-navigation-v6