Открыть окно навигации при нажатии кнопки заголовка - PullRequest
Новая
       26

Открыть окно навигации при нажатии кнопки заголовка

0 голосов
/ 21 февраля 2020

когда я смахиваю вправо, мой ящик открыт, но я хочу открыть его с помощью кнопки в заголовке, я сделал код, но у меня эта ошибка не определена, это не объект (оценивающий 'navigation.openDrawer'), это мое приложение . js код: 

import {createStackNavigator} from 'react-navigation-stack';
import { createAppContainer } from 'react-navigation';
import Home from './components/login'
import Inscription from './components/inscription'
import signup from './components/signup'
import mp from './components/motdepasse'
import ch from './components/choice'
import mn from './components/menu1'
import drawer from './components/drawerapp'
import React, { Component } from 'react';
import { Image, StyleSheet, Text, TouchableOpacity,  } from 'react-native';
import Icon from 'react-native-vector-icons/Entypo'


const Navigator = createStackNavigator({
  Home:{screen: Home},
  Profil:{screen: Inscription},
  signup:{screen: signup, navigationOptions: { header: null }},
  mp:{screen: mp},
  ch:{screen: ch},
  mn:{screen: mn},
  drawer:{screen: drawer,navigationOptions: { title:"votre travail",
  headerStyle:{backgroundColor:'#8B0000'},
  headerTitleStyle: {
     fontWeight: 'bold',
     color:'white',         
   },
   headerLeft: ({ navigation }) => (
     <TouchableOpacity onPress={() => navigation.openDrawer()} >
      <Icon name={'menu'} size={28} color={'white'} style={{marginRight:10}}/>
      </TouchableOpacity> 
   ),}},

}
);


const App = createAppContainer(Navigator);
export default App;

, и это мой код appdrawer: 

function CustomDrawerContent(props) {
  return (
    <DrawerContentScrollView {...props}>
      <DrawerItemList {...props} />
      <DrawerItem label="Help" onPress={() => alert('Link to help')} />
      <DrawerItem
        label="Close drawer"
        onPress={() => props.navigation.closeDrawer()}
      />
    </DrawerContentScrollView>
  );
}

const Drawer = createDrawerNavigator();

function MyDrawer() {
  return (
    <Drawer.Navigator drawerContent={props => CustomDrawerContent(props)}>
      <Drawer.Screen name="Feed" component={mn} />
      <Drawer.Screen name="Article" component={Article} />
    </Drawer.Navigator>
  );
}

export default class drawerapp extends React.Component {

  render(){
    const {navigate} = this.props.navigation;

  return (

    <NavigationContainer>
      <MyDrawer />
    </NavigationContainer>
  );
}}

моя работа прекрасно работает, пока я не нажму на левый заголовок кнопка и появляется ошибка

1 Ответ

0 голосов
/ 21 февраля 2020

вы получаете навигационную реквизит в неправильном месте, headerLeft не дает навигационную реквизит, поэтому вы должны получить ее из navigationOptions ...

изменить код навигатора, как показано ниже .. 


const Navigator = createStackNavigator({
  Home:{screen: Home},
  Profil:{screen: Inscription},
  signup:{screen: signup, navigationOptions: { header: null }},
  mp:{screen: mp},
  ch:{screen: ch},
  mn:{screen: mn},
  drawer:{screen: drawer,
  navigationOptions: ({navigation}) => ({ 
    title:"votre travail",
    headerStyle:{backgroundColor:'#8B0000'},
    headerTitleStyle: {
      fontWeight: 'bold',
      color:'white',         
    },
    headerLeft: () => (
      <TouchableOpacity onPress={() => navigation.openDrawer()} >
        <Icon name={'menu'} size={28} color={'white'} style={{marginRight:10}}/>
      </TouchableOpacity> 
     ),
    }),
  },
});
...