世博升级后，导航道具不适用于嵌套导航器

Question

我有一个奇怪的问题，我正在使用 Expo 开发一个 RN 应用程序。我构建了一个 StackNavigator

  const MyTheme= {
    colors:{
      background:'#fff'
    }
  }
  return(
    <NavigationContainer theme={MyTheme}>
      <Stack.Navigator initialRouteName= {firebase.auth().currentUser? 'Home': 'Login'}>


        <Stack.Screen name="Login" component={loginscreen} style={{backgroundColor:'#fff'}}
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
          
        }}/>
      
        <Stack.Screen name="Forgot" component={ForgotScreen} 
          options={{
         headerShown:false,
         cardOverlayEnabled:false
        }}
        
        />
        <Stack.Screen name="Verify" component={VerifiedScreen} style={{backgroundColor:'#fff'}}
    options={{
      animationEnabled:false,
    headerShown:false,
    cardOverlayEnabled:false
   
  }}/>

        <Stack.Screen name="Home" component={HomeScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
         
        }}
         />

         <Stack.Screen name="Manage" component={ManageScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
         cardOverlayEnabled:false
          
        }}
        
        />
         <Stack.Screen name="Menu" component={MenuScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
          
        }}
        
        />
        <Stack.Screen name="Book" component={BookScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
          
        }}
        
        />
           <Stack.Screen name="Bite" component={BiteScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
          
        }}
        
        />
           <Stack.Screen name="BookL" component={BookListScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
          cardOverlayEnabled:false
          
        }}
        
        />
           <Stack.Screen name="Chat" component={ChatScreen} 
        options={{
          animationEnabled:false,
          headerShown:false,
         cardOverlayEnabled:false
          
        }}
        
        />
           <Stack.Screen name="Single" component={SingleScreen} 
        options={{
          animationEnabled:false,
          cardOverlayEnabled:false,
        headerStyle:{
          backgroundColor:'#f2f2f2'
          
        }
          
        }}
        
        />
        <Stack.Screen name="Risto" component={RistoScreen} 
        options={{
      headerShown:false,
      cardOverlayEnabled:false
        }}
        
        />
        <Stack.Screen name="Order" component={OrderScreen} 
        options={{
        headerShown:false,
        cardOverlayEnabled:false
        }}
        
        />
        <Stack.Screen name="Settings" component={SettingScreen} 
        options={{
        headerShown:false,
        cardOverlayEnabled:false
        }}
        
        />
        <Stack.Screen name="InSettings" component={InSettingScreen} 
        options={{
        headerShown:false,
        cardOverlayEnabled:false
        }}
        
        />
        
   <Stack.Screen name="Local" component={LocalScreen} style={{backgroundColor:'#fff'}}
    options={{
    
    
    headerShown:false,
    cardOverlayEnabled:false
  }}/>
  <Stack.Screen name="List" component={ListScreen} style={{backgroundColor:'#fff'}}
    options={{
   
    headerShown:false,
    headerStyle:{
      
     
      borderBottomWidth:0,
      elevation:0
      
    }
  }}/>
  
  
  </Stack.Navigator>

  </NavigationContainer>
  );

我在 HomeScreen 中有另一个 StackNav，如下所示：

 <View style={{height:'100%',width:'60%',padding:10}}>
<NavigationContainer theme={MyTheme} independent={true}>
    <Stack1.Navigator initialRouteName="Home">
  
      <Stack1.Screen name="Order" component={OrderScreen} style={{backgroundColor:'#fff'}}
      options={{
        animationEnabled:false,
        headerShown:false,
        cardOverlayEnabled:false,
       
        
      }}/>
      <Stack1.Screen name="Chat" component={SingleScreen} style={{backgroundColor:'#fff'}}
      options={{
        animationEnabled:false,
        headerShown:false,
        cardOverlayEnabled:false,
       
      }}/>
      <Stack1.Screen name="Warn" component={WarnScreen} style={{backgroundColor:'#fff'}}
      options={{
        animationEnabled:false,
        headerShown:false,
        cardOverlayEnabled:false
        
      }}/>
    </Stack1.Navigator>
    </NavigationContainer>



   </View>

我一直在使用 Expo 37，直到它被弃用并更新到 41。 现在我遇到了导航道具的问题。在更新之前一切正常。现在当我调用它在主堆栈中导航时没有问题，但是当

navigation.navigate('Home',{screen:'Warn'})

被称为什么都没有发生，这很奇怪，也许有些事情发生了变化。 我的依赖

 "@react-native-async-storage/async-storage": "^1.15.3",
    "@react-native-community/datetimepicker": "3.2.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/drawer": "^5.8.1",
    "@react-navigation/native": "^5.7.0",
    "@react-navigation/stack": "^5.3.9",
    "expo": "^41.0.1",
    "firebase": "8.2.3",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz",
    "react-native-dialog": "^5.6.0",
    "react-native-element": "^1.2.1",
    "react-native-gesture-handler": "~1.10.2",
    "react-native-gifted-chat": "^0.16.3",
    "react-native-indicators": "^0.17.0",
    "react-native-modal-datetime-picker": "^9.2.1",
    "react-native-reanimated": "~2.1.0",
    "react-native-safe-area-context": "3.2.0",
    "react-native-screens": "~3.0.0",
    "react-native-web": "~0.13.12",
    "react-navigation": "^4.4.0",
    "react-redux": "^7.2.0",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0"

Answer 1

我不知道为什么解决了在我发布的代码的第二个 sn-p 中删除 NavigationContainer 标记