React Native Navigation报错：No overload matches this call 求助

报错信息 #

"message": "No overload matches this call.\n  Overload 1 of 2, '(...args: never): void', gave the following error.\n    Argument of type 'string' is not assignable to parameter of type 'never'.\n  Overload 2 of 2, '(options: never): void', gave the following error.\n    Argument of type 'string' is not assignable to parameter of type 'never'."

问题原因 #

调用useNavigation()时未指定正确的导航类型，导致TypeScript无法识别navigate方法的合法参数，将参数类型推断为never，与传入的'Signup'字符串类型冲突。

解决方案 #

修改HomeScreen.tsx的导航类型声明 #

给useNavigation()添加泛型约束，指定为基于RootStackParamList的栈导航属性类型：

import React from 'react';
import { View, StyleSheet, Text, Pressable } from 'react-native';
import { useNavigation } from '@react-navigation/native';
import { useQuery, gql } from '@apollo/client';
import { RootStackParamList, StackNavigationProp } from '../navigation/types';

export default function HomeScreen() {
  // 指定导航类型为RootStackParamList对应的栈导航属性
  const navigation = useNavigation<StackNavigationProp<RootStackParamList>>();

  return (
    <View style={styles.container}>
      <Pressable 
        onPress={() => {
          console.warn('navigate'); 
          navigation.navigate('Signup');
        }} 
      >
        <Text>New here? Sign up</Text>
      </Pressable>   
    </View>
  );
}

补充说明 #

• 若需要更精确的类型约束（限制当前页面仅能导航到特定路由），可指定当前页面的路由名称：

  const navigation = useNavigation<StackNavigationProp<RootStackParamList, 'Home'>>();
  

• 你的types.tsx中已正确定义包含Signup的RootStackParamList，这部分无需修改。
• 原代码中存在重复导入（Text、View）和多余语法符号（末尾的);），建议一并修正以避免潜在问题。

内容的提问来源于stack exchange，提问作者pelotador.1