reactjs - 尝试设置选项卡导航器时出错

Question

我目前收到错误消息'Get an invalid value for 'component' prop for screen 'Home'。它必须是一个有效的 React 组件。'' 我正在尝试将选项卡导航器链接到一系列不同的屏幕。请参阅下面的代码，并提前致谢。我显然是初学者哈哈

import React from 'react';
import {
  SafeAreaView,
  StyleSheet,
  ScrollView,
  View,
  Text,
  StatusBar,
} from 'react-native';

import {NavigationContainer} from '@react-navigation/native';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'
import { create } from 'react-test-renderer';
import Home from './Screen/Home'
import Future from './Screen/Future'

const Tabs=createBottomTabNavigator();
export default function App (){
return (
<NavigationContainer>
  <Tabs.Navigator>
 <Tabs.Screen name='Home' component={Home} />
 <Tabs.Screen name='Future' component={Future} />

  </Tabs.Navigator>


</NavigationContainer>


);
}
const Home= ()=>{
return(
<View>
<Text>HOME NAV</Text>
</View>
)
}
const Future= ()=>{
  return(
  <View>
  <Text>Future</Text>
  </View>
  )
  }

Answer 1

改变

const HomeScreen= ()=>{...}

至

const Home= ()=>{...}

Answer 2

您的函数名称是 HomeScreen，但您使用 Home 作为选项卡导航中的组件。请检查一下，让我知道它是否有效