react navigation 如何关闭DrawerNavigator嵌套的StackNavigator？

Question

我想关闭 screen: ExportClues 上的抽屉，但它不起作用。

这是我的代码。

const Drawer = DrawerNavigator( {
  Navigators: {
            screen: Navigators
         },
     {
           initialRouteName: 'Navigators',
           drawerWidth: Metrics.screenWidth - 95,
           drawerPosition: 'right',
           contentComponent:  MenuNavigator 
      }
})


const Navigators = StackNavigator({
     ...screen
})

const MenuNavigator = StackNavigator({
       ExportClues: {
                 screen: ExportClues,
        },
       ...other screen
})

是ExportClues组件：

export default class index extends Component {

                   render() {
                        return(
                               <View
                                        style={{flex: 1, backgroundColor: '#ffffff'}}
                                 >
                                      <TouchableOpacity
                                          onPress={()=>{
                                             this.props.navigation.navigate('DrawerClose');
                                              // It is not work
                                             }}
                                         >
                                      <TouchableOpacity/>
                                </View>
                         )
                     }
 }

对不起，我的英语很差

如何将 MenuNavigator Parent Navigator 设为 DrawerNavigator？

Answer 1

查看您提供的 link，您试图错误地包含 Drawer 组件：你写从 './drawer' 导入抽屉并尝试使用组件但是您的 drawer.js 文件正在导出 "CustomerManagerDrawerNavigator"

export default CustomerManagerDrawerNavigator;

这意味着你的代码应该是从 './drawer' 导入 CustomerManagerDrawerNagivator 你的组件应该被称为在 render() 函数中。

如果你想使用 DrawerNavigator，你需要改变你的

const MenuNavigator = StackNavigator({

到

const MenuNavigator = DrawerNavigator({

要在 ExportClues 中关闭抽屉，您可以调用

this.props.navigation.navigate('DrawerClose'); // close drawer

我看到你有，但你没有在导航器配置中传递任何导航选项，所以你无权访问导航功能。您需要类似于以下代码的内容：

navigationOptions: ({navigation}) => ({
 .../*Your navigation options here */
}),

将导航作为道具传递给打开的抽屉

我会查看位于 https://reactnavigation.org/docs/navigators/drawer 的 DrawerNavigator 的 React-Navigation 主页以获取更多详细信息，或者如果可能的话 post link 到工作存储库

react navigation 如何关闭DrawerNavigator嵌套的StackNavigator？

react navigation How to close the DrawerNavigator nested StackNavigator？

react-native

react-navigation