菜单按钮单击事件以打开SideMenu不起作用React Native

时间:2018-08-23 08:20:37

标签: react-native

enter image description here

菜单按钮单击事件以打开SideMenu在React Native中不起作用。我尝试使用下面的代码打开SideMenu,但无法正常工作,请检查我的代码。

import React, {Component} from 'react';
import {StyleSheet, Text, View} from 'react-native';
import {Icon, Button, Container, Header, Content, Left, Title, Body, Right} from 'native-base';
export default class Training extends Component {
    static navigationOptions = {
        drawerIcon:(
            <Icon name="grid" style={{fontSize: 24, color: 'white'}}/>
        )
    }
    render() {
      return (
          <Container>
               <Header style={{backgroundColor:'rgb(0,0,0)'}}>
          <Left>
            <Button transparent>
              <Icon name='menu' 
              onPress={() => this.props.navigation.navigate('DrawerOpen')}
              />
            </Button>
          </Left>
          <Body>
            <Title>Training</Title>
          </Body>
          <Right />
        </Header>

              <Content contentContainerStyle={{
                  flex: 1,
                  alignItems: 'center',
                  justifyContent: 'center'
              }}>
                  <Text>Training</Text>
              </Content>
          </Container>
      );
    }
  }

LeftMenu

import React, {Component} from 'react';
import {StyleSheet, Text, View, StatusBar, Image} from 'react-native';
import {DrawerNavigator, DrawerItems} from 'react-navigation';
import Registration from './src/pages/Registration';
import { Container, Header, Body, Content, Icon } from 'native-base';
import Training from './src/pages/Training';
  export default class LeftMenu extends Component {
  render() {
    return (
        <NavMenu/>
    );
  }
}
const CustomDrawerContentComponent = (props) => (
  <Container>
    <Content  style={{backgroundColor:'#000000'}}>
      <DrawerItems {...props} labelStyle={{color: '#ffffff'}} />
    </Content>
  </Container>
)


const NavMenu = DrawerNavigator({
  Training:{screen: Training},
  Registration:{screen: Registration}
},
{
  initialRouteName:'Training',
  contentComponent: CustomDrawerContentComponent,
  drawerOpenRoute: 'DrawerOpen',
  drawerCloseRoute: 'DrawerClose',
  drawerToggleRoute: 'DrawerToggle',
},

)
const styles = StyleSheet.create({
  container:{
    backgroundColor: '#000000',
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
  drawerImage:{
    height:65,
    width:65,
    alignSelf: 'center',
  },
});

菜单图标按钮单击事件以打开SideMenu在React Native中不起作用。我尝试了上面的代码打开SideMenu,但是它不起作用,请检查我的代码。

0 个答案:

没有答案