反应页面之间的导航

Question

我得到一个组件异常错误。找不到"component"、"getComponent"或"children"属性。

我查看了一些谷歌搜索，我唯一能找到的是我需要使用export default X和import X from 'path'一起使用export和import { X } from 'path'。

我不知道我在这里做错了什么。有人能帮忙吗?

这是我的主页。jsx:

const HomePage = () => {
return (
<View>
<Text>Home Page</Text>
</View>
);
};
export default HomePage;

这是我的App.jsx:

import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import HomePage from './src/pages/HomePage';
import TablePage from './src/pages/TablePage';
const App = () => {
return (
<NavigationContainer>
<View style={styles.container}>
<Text>Open up App.jsx to start working on your app!</Text>
<StatusBar style="auto" />
</View>
<TabNavBar />
</NavigationContainer>
);
};
const Tab = createBottomTabNavigator();
function TabNavBar() {
return (
<Tab.Navigator>
<Tab.Screen name="Home" compotent={HomePage} />
<Tab.Screen name="Table" compotent={TablePage} />
</Tab.Navigator>
);
}

Answer 1

请替换

<Tab.Screen name="Home" compotent={HomePage} /> 

<Tab.Screen name="Home" component={HomePage} />

和"Table"。