gpt4 book ai didi

reactjs - React Native 导航从标题按钮打开绘图

转载 作者:行者123 更新时间:2023-12-03 14:13:10 31 4
gpt4 key购买 nike

我正在尝试从堆栈导航标题按钮打开导航绘图。标题按钮显示正常,但是当我单击该按钮时,我得到了

undefined is not an object (evaluating '_this.props.navigate')

我似乎找不到一个可靠的例子来说明如何做到这一点,或者是否可以通过 react 导航来实现。

import React, { Component } from 'react';
import { createStackNavigator, NavigationActions } from 'react-navigation'
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { Draw } from './DrawNav.js'

export const RootStack = createStackNavigator (
{
DrawNav: {
screen: Draw,
navigationOptions: ({ navigation }) => ({
//Hide the shadow of the header
headerStyle: {
elevation:0,
shadowColor: 'transparent',
shadowRadius: 0,
shadowOffset: {
height: 0,
}
},
headerLeft: (
<View style={{marginLeft: 10}}>
<Icon
name="menu"
size={25}
color="#D4AF37"
onPress={() => this.props.navigation.openDrawer()}
/>
</View>
),
})
},
},
);

最佳答案

this.props 仅在 React 类中使用。我假设您使用的是react-navigation v2,那么您应该像下面这样调度DrawerAction

import React, { Component } from 'react';
import { createStackNavigator, NavigationActions } from 'react-navigation'
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
import { DrawerActions } from 'react-navigation';
import { Draw } from './DrawNav.js'

export const RootStack = createStackNavigator (
{
DrawNav: {
screen: Draw,
navigationOptions: ({ navigation }) => ({
//Hide the shadow of the header
headerStyle: {
elevation:0,
shadowColor: 'transparent',
shadowRadius: 0,
shadowOffset: {
height: 0,
}
},
headerLeft: (
<View style={{marginLeft: 10}}>
<Icon
name="menu"
size={25}
color="#D4AF37"
onPress={() => navigation.dispatch(DrawerActions.openDrawer())}
/>
</View>
),
})
},
},
);

关于reactjs - React Native 导航从标题按钮打开绘图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50440814/

31 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com