嵌套在"材质底部"选项卡中的堆栈在您第二次导航时不显示内容(React Navigation v6)

Question

问题：

当我第一次导航到"材质底部"内的"堆栈"时，一切都很好，之后更改选项卡，返回内容时不再渲染。

预期行为：

每次选择选项卡时，都必须渲染"堆栈"。换句话说，每次导航到选项卡时，我都能看到选项卡内堆栈的内容。

版本

包
@react navigation/nature	6.0.6
@react导航/材料底部选项卡	6.0.9
@react导航/本机堆栈	6.2.5
反应本地安全区域上下文	3.3.2
反应本机屏幕	3.8.0
react native	0.64.2
博览会	43.0.0

面临同样的问题。

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

您应该使用具有可折叠false的视图来包装嵌套导航器。我的代码示例：

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>
)