React Native TSX报错：类型'{}'缺少必填属性'navigation'

你的问题出在FirstComponent的TypeScript类型定义里将navigation设为了必填属性，但在HomePage中使用<FirstComponent />时没有传递这个参数，导致TypeScript抛出类型校验错误。

给你三种针对性的解决办法：

• 如果FirstComponent必须依赖navigation：
  要是HomePage本身处于React Navigation的导航栈中（自身能拿到navigation prop），直接在调用时传入即可：

  // 在HomePage组件内
  <FirstComponent navigation={navigation} />
  

• 如果FirstComponent不一定需要navigation：
  修改FirstComponent的Props类型，把navigation设为可选属性（加?）：

  type FirstComponentProps = {
    navigation?: any;
  };
  
  const FirstComponent = ({ navigation }: FirstComponentProps) => {
    // 你的组件逻辑
  };
  

• 推荐：使用React Navigation的钩子替代传参：
  直接在FirstComponent内部通过useNavigation钩子获取导航实例，这样就不用在Props里定义navigation了，更符合React Navigation的最佳实践：

  import { useNavigation } from '@react-navigation/native';
  
  const FirstComponent = () => {
    const navigation = useNavigation();
    // 你的组件逻辑
  };
  

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