React native _此.\u drawer.open不是本机函数_React Native_React Native Ios_Native Base_React Native Drawer

React native _此.\u drawer.open不是本机函数

react-native

React native _此.\u drawer.open不是本机函数,react-native,react-native-ios,native-base,react-native-drawer,React Native,React Native Ios,Native Base,React Native Drawer,我正在为我的react本机应用程序使用本机库中的drawer。当你点击菜单按钮，抽屉没有打开，我得到这个错误（\u this.\u drawer.open）不是功能什么是isse这是我的代码 import React, { Component } from 'react'; import { AppRegistry,View } from 'react-native'; import {ScrollableTab,TabHeading, Drawer, Container,Content, He

我正在为我的react本机应用程序使用本机库中的drawer。当你点击菜单按钮，抽屉没有打开，我得到这个错误（\u this.\u drawer.open）不是功能什么是isse这是我的代码

import React, { Component } from 'react';
import {
AppRegistry,View
} from 'react-native';
import {ScrollableTab,TabHeading, Drawer, Container,Content, Header, 
Title, Button, Left, Right, Body, Icon ,Text,Tab, Tabs } from 'native-base';
import SecondStatus from './component/StatusComponent';
import HeaderComponent from './component/headerComponent';
import Sports from './component/Sports';
import MainPage from './component/MainPage';
import SideBar from './component/SideBar';

export default class Point extends Component {
    closeDrawer = () => {
    this.drawer.close()
   };
   openDrawer = () => {
    alert('asasa click');
    console.log('asad--');
    this._drawer.open();
    };
   render() {

   return (
          <Container>
           <Drawer
          ref={(ref) => { this._drawer = ref; }}
          content={<SideBar  />}
          onClose={() => this.closeDrawer()} >

            <Header  >
              <Left>
                <Button transparent onPress={this.openDrawer}>
                    <Icon name='arrow-back' />
                </Button>
            </Left>
            <Body>
                <Title>UrduPoint</Title>
            </Body>
            <Right>
                <Button transparent onPress=
         {this.openDrawer.bind(this)}>
                        <Icon name='menu' />
                    </Button>
            </Right>
            </Header>

         </Drawer>




        </Container>
     );
  }
 }

AppRegistry.registerComponent('Point', () => Point);

import React，{Component}来自'React'；
进口{
观察、观察
}从“反应本机”；
导入{ScrollableTab，TabHeading，抽屉，容器，内容，标题，
标题、按钮、左、右、主体、图标、文本、选项卡、选项卡}来自“本机基础”；
从“./component/StatusComponent”导入第二状态；
从“./component/HeaderComponent”导入HeaderComponent；
从“./组件/运动”导入运动；
从“./component/MainPage”导入主页面；
从“./component/SideBar”导入侧栏；
导出默认类点扩展组件{
closeDrawer=（）=>{
this.drawer.close（）
};
openDrawer=（）=>{
警报（“asasa点击”）；
console.log（'asad--'）；
这是我的抽屉；
};
render（）{
返回(
{this.\u drawer=ref；}}
内容={}
onClose={（）=>this.closeDrawer（）}>
乌尔都点
);
}
}
AppRegistry.registerComponent（'点'，（）=>点）；

这是我的侧边栏

  import React, { Component } from 'react';
  import {
 Text,
View,
 StyleSheet
} from 'react-native';

export default class SideBar extends Component{
render(){
    return(
 <View>
   <Text>
     asad
     </Text>
   </View>

    )
   };

 }

import React，{Component}来自'React'；
进口{
文本，
看法
样式表
}从“反应本机”；
导出默认类边栏扩展组件{
render（）{
返回(
阿萨德
)
};
}

注：此抽屉与npm“react native抽屉”中的抽屉相同。

根据，您应该调用：

this.drawer.root.open（）
import React, { Component } from 'react';
import {
  Container,
  Header,
  Left,
  Button,
  Icon,
  Body,
  Title,
  Right,
  Content,
  Drawer,
  Text
} from 'native-base';
import {
  StyleSheet,
  View,
  ScrollView
} from 'react-native';

class SideBar extends Component {
  render() {
    return (
      <Container>
        <Content
          bounces={false}
          style={{ flex: 1, backgroundColor: '#fff', top: -1 }}
        >
          <Button transparent>
            <Text>Action</Text>
          </Button>
        </Content>
      </Container>
    );
  }
}

export default class Core extends Component {
  openDrawer() {
    this._drawer._root.open();
  }
  closeDrawer() {
    this._drawer._root.close();
  }
  render() {
    return (
      <Drawer
        ref={(ref) => { this._drawer = ref; }}
        content={<SideBar navigator={this._navigator} />}
        onClose={() => this.closeDrawer()}
      >
        <Container>
          <Header>
            <Left>
              <Button
                transparent
                onPress={() => this.openDrawer()}
              >
                <Icon name='menu' />
              </Button>
            </Left>
            <Body>
              <Title>TITLE</Title>
            </Body>
            <Right />
          </Header>
          <Content>
          </Content>
        </Container>
      </Drawer>
    );
  }
}

import React，{Component}来自'React'；
进口{
集装箱，
标题，
左边
按钮
偶像
身体，
标题
正确的，
内容,，
抽屉，
正文
}来自“本土基地”；
进口{
样式表，
看法
卷轴视图
}从“反应本机”；
类边栏扩展组件{
render（）{
返回(
行动
);
}
}
导出默认类核心扩展组件{
openDrawer（）{
这个._drawer._root.open（）；
}
抽屉{
此._drawer._root.close（）；
}
render（）{
返回(
{this.\u drawer=ref；}}
内容={}
onClose={（）=>this.closeDrawer（）}
>
this.openDrawer（）}
>
标题
);
}
}
以下是其文档中提供的示例，其中有一条注释说，您需要创建自己的边栏组件并导入它。

抽屉示例代码
import React, { Component } from 'react';
import { Drawer } from 'native-base';
import SideBar from './yourPathToSideBar';
export default class DrawerExample extends Component {
    render() {
      closeDrawer = () => {
        this.drawer._root.close()
      };
      openDrawer = () => {
        this.drawer._root.open()
      };
        return (
            <Drawer
              ref={(ref) => { this.drawer = ref; }}
              content={<SideBar navigator={this.navigator} />}
              onClose={() => this.closeDrawer()} >
            // Main View
          </Drawer>
        );
    }
}

import React，{Component}来自'React'；
从“本机基”导入{Drawer}；
从“/yourPathToSideBar”导入侧栏；
导出默认类DroperExample扩展组件{
render（）{
closeDrawer=（）=>{
此.drawer.\u root.close（）
};
openDrawer=（）=>{
此.drawer.\u root.open（）
};
返回(
{this.drawer=ref；}}
内容={}
onClose={（）=>this.closeDrawer（）}>
//主视图
);
}
}

查收
此.\u抽屉.\u root.open（）
是为我工作的
是不是你叫这个抽屉

而不是这个抽屉？