React Native中React Navigation栈导航报错：Element无法赋值指定类型

你犯了一个常见的使用错误：Stack.Screen的component属性要求传入组件的引用（类/函数本身），而不是你现在写的<HomeScreen />这种已经渲染好的React元素实例，这就是类型报错的核心原因。

修正后的代码如下：

import React from 'react';
import {createNativeStackNavigator} from '@react-navigation/native-stack';
import HomeScreen from '../screens/HomeScreen';

const Stack = createNativeStackNavigator();

export const HomeTab = () => (
  <Stack.Navigator>
    <Stack.Screen name="Home" component={HomeScreen} />
  </Stack.Navigator>
);

如果需要给HomeScreen传递自定义参数，不要直接在component里渲染实例，推荐用以下两种方式：

• 方式一：使用initialParams传递初始参数

<Stack.Screen 
  name="Home" 
  component={HomeScreen} 
  initialParams={{ someKey: 'someValue' }} 
/>

• 方式二：使用children渲染组件并传参

<Stack.Screen name="Home">
  {() => <HomeScreen customProp="Hello" />}
</Stack.Screen>

内容的提问来源于stack exchange，提问作者MIPB