访问不同组件的参考

Question

我将滑块菜单react-native-drawer-menu添加到a​​pp.js

中的应用

<Drawer
      style={styles.container}
      drawerWidth={300}
      drawerContent={drawerContent}
      type={Drawer.types.Overlay}
      customStyles={{drawer: styles.drawer}}
      drawerPosition={Drawer.positions.Left}
      onDrawerOpen={() => {console.log('Drawer is opened');}}
      onDrawerClose={() => {console.log('Drawer is closed')}}
      easingFunc={Easing.ease}
    >
      <Provider store={store}>
      <MenuContext>
        <RootContainer />
      </MenuContext>
      </Provider>

    </Drawer>

在root容器中，我创建app-navigator并加载第一个视图WelcomeContainer。一切正常，我可以在welcomeContainer中滑动以打开菜单。

现在，当我点击标题上的菜单图标时，我还尝试打开菜单。标题在WelcomeContainer上创建。这是代码

render() {
    const {language} = this.props
    const {navigate, setParams} = this.props.navigation
    return (
      <Drawer ref={drawer => this.drawer = drawer}>
      <View style={ styles.container }>
      <Header

  leftComponent = {
  { 
    icon: 'menu', 
    color: '#5c72b0', 
    onPress: () => this.drawer.openDrawer()
  } 
}
  centerComponent={<ChangeLanguage />} 
  rightComponent={<HeaderUserInformation />} 
  outerContainerStyles={{ backgroundColor: '#eee9e9' }}
/>

不幸的是，这种剂量不能正常工作。这是滑块菜单的样子：

因此滑动工作正常但不能手动打开菜单。你对这个问题有什么看法吗？我觉得通过点击，我打开抽屉的错误参考菜单，但我无法找到问题。