4

我正在为我的第一个 react-native 项目使用 react-navigation https://reactnavigation.org/ 。我想切换我的抽屉（打开和关闭），但我不知道如何实现这一点。我一直在查看 reactnavigation.org 的文档，但找不到任何提示。

4

5 回答 5

6

正如 React Navigation(v2)

要打开和关闭抽屉，请使用以下助手打开和关闭抽屉：

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

如果您想切换抽屉，请调用以下命令：

this.props.navigation.toggleDrawer();

在幕后，这些函数中的每一个都只是调度操作：

this.props.navigation.dispatch(DrawerActions.openDrawer());
this.props.navigation.dispatch(DrawerActions.closeDrawer());
this.props.navigation.dispatch(DrawerActions.toggleDrawer());
于 2018-07-07T06:40:11.677 回答
5

如果您想切换抽屉，您可以导航到“DrawerToggle”，这将根据抽屉当前状态选择适合您的导航。

相应地触发 'DrawerOpen&DrawerClose'

this.props.navigation.navigate('DrawerToggle');

于 2017-11-16T08:06:19.353 回答
3

根据文档：

要打开和关闭抽屉，请分别导航到“DrawerOpen”和“DrawerClose”。

this.props.navigation.navigate('DrawerOpen'); // open drawer
this.props.navigation.navigate('DrawerClose'); // close drawer
于 2017-03-06T22:00:43.067 回答
2

查看 this.props.navigation.state。您应该能够在 routeName 中找到“DrawerOpen”或“DrawerClose”，如本例所示。

于 2017-05-11T15:26:39.823 回答
2

对于版本 5.x：

导入抽屉动作：

import { DrawerActions } from "@react-navigation/native";

你可以使用navigation.dispatch(DrawerActions.toggleDrawer())

于 2021-06-11T19:32:39.763 回答