Question

反应式导航，抽屉出现问题

所以，我的问题是：当我点击菜单图标时，抽屉没有打开，我正在使用react-navigation-drawer，但出现错误：“ TypeError：undefined不是一个对象（正在评估'navigation。导航'）”。这是我的代码：

import {createDrawerNavigator,NavigationActions} from 'react-navigation-drawer';
import {TouchableHighlight,View} from 'react-native';
import React from 'react';
import Icon from 'react-native-vector-icons/EvilIcons';
Icon.loadFont();

import Perfil from '../telas/perfil';
import Loja from '../telas/loja';
import Registrador from '../telas/registrador';
import Diy from '../telas/diy';
import QuemSomos from '../telas/quemSomos';
import Problemas from '../telas/problemas';

const DrawerScreen = createDrawerNavigator({
    Perfil:{screen: Perfil},
    Loja:{screen: Loja},
    Registrador:{screen: Registrador},
    Diy:{screen:Diy},
    QuemSomos:{screen:QuemSomos},
    Problemas:{screen:Problemas}
},{
    headerMode:'float'
})

const HeaderButton=(

    <View>
        <TouchableHighlight onPress={()=>navigation.navigate("drawerOpen")}>
            <Icon name="navicon" size={40} color="#FFF"/>
        </TouchableHighlight>    
    </View>

)

DrawerScreen.navigationOptions= {

    /*headerTitle:*/
    title: 'Waste Not',
    headerMode:'float',
    headerLeft: HeaderButton,
    headerTitleStyle:{
        textAlign:'center',
        flex: 1
    },
    headerStyle: {
        backgroundColor: '#aeead3',
    }, 
    headerTintColor: 'green',

}



export default DrawerScreen;

Answer 1

您可以在导航之前尝试使用this.prop：

const HeaderButton=(

    <View>
        <TouchableHighlight onPress={()=>this.prop.navigation.navigate("drawerOpen")}>
            <Icon name="navicon" size={40} color="#FFF"/>
        </TouchableHighlight>    
    </View>

)

反应本机抽屉

1 个答案: