如何在注销时从 react native drawer-navigator 中删除屏幕(卸载组件)?如何重新加载组件数据?

Hri*_*shi 4 react-native react-native-component react-native-navigation

我在我的应用程序中使用反应导航 v3,我在抽屉导航器中使用堆栈导航器,单击注销时我导航到登录屏幕并清除用户存储,但是每当我再次登录时,主要组件不会调用 componentWillMount 或 componentDidMount 方法,并在其上显示先前加载的数据。这是我的代码 >

const screens = {
  login: { screen: Login },
  dashboard: { screen: Dashboard },
  patientList:{screen:StackNav},
  headerComponent:HeaderComponent
 }

  const MyDrawerNavigator = createDrawerNavigator(
     screens,
      {
       initialRouteName: 'login',
      contentComponent: Sidebar
       }
     );

    App  = createAppContainer(MyDrawerNavigator);
    export default App;
Run Code Online (Sandbox Code Playgroud)

堆栈导航 ==

export default createStackNavigator({
     PatientList,
     PatientDetails
 });
Run Code Online (Sandbox Code Playgroud)

登出功能 ==

  localStorageService.removeAllKeys().then((res) => {
    this.props.navigation.navigate(route, { isLogin: 'N' })
  });
Run Code Online (Sandbox Code Playgroud)

Mah*_*our 12

在 React 导航 5.x 中

unmountOnBlur

<Drawer.Screen
    name={...}
    component={...}
    unmountOnBlur={true}
    options={{unmountOnBlur: true}}
/>
Run Code Online (Sandbox Code Playgroud)

  • 如果我不需要抽屉而只想使用 stackNavigator 怎么办? (2认同)

Dan*_*wan 6

把它放在抽屉导航器的导航选项中

unmountInactiveRoutes: true
Run Code Online (Sandbox Code Playgroud)