反应导航:抽屉导航器出现在背景中

问题描述 投票:0回答:3

我正在使用来自React Navigation的DrawerNavigator。我注意到有时我可以看到Drawer Navigator在某些“视图”后面打开,例如,在我打开相机或询问用户权限之前。

下面是我的DrawerNavigator的简化示例(代码)。我想知道如何在背景中隐藏DrawerNavigator

import { createAppContainer, createDrawerNavigator } from "react-navigation";


import FAQ from "./FAQ";
import Home from "./Home";


const MainNavigator = createDrawerNavigator(
  {
    Home: {
      screen: Home
    },

    FAQ: {
      screen: FAQ
    }
  }
);

const App = createAppContainer(MainNavigator);
export default App;

示例图像。

An example of this can be seen here.

react-native react-navigation expo
3个回答
1
投票

你可以在开始之前手动关闭它。

To open and close drawer, use the following helpers to open and close the drawer:

this.props.navigation.openDrawer();
this.props.navigation.closeDrawer();

1
投票

您可以使用以下代码关闭抽屉,

从“react-navigation”导入DrawerActions

import { DrawerActions } from "react-navigation";
.....

this.props.navigation.dispatch(DrawerActions.closeDrawer());

0
投票

错误结果与此行this.setState({ appState: nextAppState });有关。这设置了应用状态,即应用是焦点还是后台。删除此行似乎解决了我的DrawerNavigator问题。

  componentDidMount = async () => {
    AppState.addEventListener("change", this.appInFocus);
    this.setState({
      appState: AppState.currentState
    });
  };

  componentWillUnmount = () => {
    AppState.removeEventListener("change", this.appInFocus);
  };

  appInFocus = async (nextAppState: PossibleAppStates) => {
    if (
      this.state.appState.match(/inactive|background/) &&
      nextAppState === "active"
    ) {
       console.log("HELLo")
    }
    this.setState({ appState: nextAppState });
  };
}
© www.soinside.com 2019 - 2024. All rights reserved.