我正在关注本教程https://reactnavigation.org/docs/intro/ 并且遇到了一些问题。
我每次都使用 Expo Client 应用程序来渲染我的应用程序,而不是模拟器/模拟器。
我的代码如下所示。
我最初在“ChatScreen”组件上方定义了“SimpleApp”常量,但这给了我以下错误:
路线“聊天”应该声明一个屏幕。例如:...等
所以我将 SimpleApp 的声明移到“AppRegistry”上方,并标记了一个新错误
元素类型无效:预期的字符串.....您可能忘记导出组件..等
本教程没有在任何组件中添加关键词“导出默认值”,我认为这可能与我在 Expo 应用程序上运行它有关?所以我在“HomeScreen”中添加了“export default”,错误就消失了。
我似乎无法摆脱的新错误(基于下面的代码)如下:
undefined 不是对象(评估“this.props.navigation.navigate”)
除非我删除“const {navigate}”周围的“{}”,否则我无法摆脱它,但是当我从主屏幕按下按钮时,这会破坏导航
import React from 'react';
import {AppRegistry,Text,Button} from 'react-native';
import { StackNavigator } from 'react-navigation';
export default class HomeScreen extends React.Component {
static navigationOptions = {
title: 'Welcome',
};
render() {
const { navigate } = this.props.navigation;
return (
<View>
<Text>Hello, Chat App!</Text>
<Button
onPress={() => navigate('Chat')}
title="Chat with Lucy"
/>
</View>
);
}
}
class ChatScreen extends React.Component {
static navigationOptions = {
title: 'Chat with Lucy',
};
render() {
return (
<View>
<Text>Chat with Lucy</Text>
</View>
);
}
}
const SimpleApp = StackNavigator({
Home: { screen: HomeScreen },
Chat: { screen: ChatScreen },
});
AppRegistry.registerComponent('SimpleApp', () => SimpleApp);