我仍然试图理解这个React导航5.0. Fyi我使用博览会,现在没有问题时,从一个页面导航到其他,问题是当我把导航的headerRight.我把headerRight在堆栈.导航,因为我希望这个按钮可以从其他屏幕访问.
所以基本上问题是,我想把注销按钮在headerRight,但当我试图把导航.导航它sait undefined不是一个对象(评估'_this. props')
然后我试着调用一个函数(单击),问题是undefined不是一个对象。
我可以知道我的代码有什么问题吗?
下面是我的完整代码:
import * as React from 'react';
import { Button, View, Text, TextInput, Image, StyleSheet } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import LoginScreen from './src/pages/auth/Login';
import HomeScreen from './src/pages/auth/HomeScreen';
const Stack = createStackNavigator();
export default function App() {
// handleClick = () => {
// this.props.navigation.navigate('Login');
// }
return (
<NavigationContainer>
<Stack.Navigator mode="modal" initialRouteName="Login" screenOptions={{
headerStyle: {
backgroundColor: '#f4511e',
},
headerRight: () => (
<Button
// only alert is ok, the other is error.
// onPress={() => alert('Success Logout!')}
onPress={this.handleClick}
// onPress={this.props.navigation.navigate('Home')}
title="Logout"
color="#fff"
/>
),
headerTintColor: '#fff',
headerTitleStyle: {
fontWeight: 'bold',
},
}}>
<Stack.Screen name="Login"
name="Login"
component={LoginScreen}
options={{
title: 'Simple Scorecard',
}} />
<Stack.Screen
name="Home"
component={HomeScreen}
options={{
title: 'Home Menu',
}}
/>
</Stack.Navigator>
</NavigationContainer>
);
}
字符串
谢谢你之前
2条答案
按热度按时间cidc1ykv1#
你应该试试这个。
通过将属性
screenOptions
转换为函数,可以接收到对路由器(navigation
)的引用。字符串
46qrfjad2#
我的答案是。你必须传递“导航”,并将“选项”转换为函数
字符串