类型参数 '[never, { email: string;密码：字符串； }]' 不可分配给“never”类型的参数

Question

我正在使用 expo 和 React Native，尝试使用导航将道具推送到其他屏幕。代码编译并推送道具，但是当将道具作为第二个参数传递给 navigation.navigate() 函数时，我收到此错误：

类型参数 '[never, { email: string;密码：字符串； }]' 不可分配给“never”类型的参数。

在尝试导航到屏幕而不传递道具时，我也会收到此错误：

“string”类型的参数不可分配给“{ key: string;”类型的参数参数？：未定义；合并？：布尔值 |不明确的; } | { name: "注册";键？： 字符串 |不明确的;参数：未定义；合并？：布尔值 |不明确的; } | { 键：字符串；参数？：{ 电子邮件：字符串；密码：字符串； } |不明确的;合并？：布尔值 |不明确的; } | ... 10 更多... | { ...; }'.ts(2345)

当我添加“从未如此”时，它就消失了。

这是我在 SignUp.tsx 屏幕中调用该函数的位置：

import { RootStackParamList } from "../../App";
import { NativeStackScreenProps } from "@react-navigation/native-stack";
type propsType = NativeStackScreenProps<RootStackParamList, 'SignUp'>;

const SignUp = (props: propsType) => {
    const {navigation} = props;

.......

            return(
               ...
                <MainButton 
                canGoBack 
                style={tw`h-20 justify-center mt-3 mx-auto`} 
                text={"Sign up"} 
                targetPage="Characteristics" 
                onPress={() => navigation.navigate("Characteristics" )} 
                navigationData={{ email: formInput.email, password: formInput.password }} />)

这是 App.tsx，其中有 RootStackParamList 类型以及 Stack Navigator：

export type RootStackParamList = {
    Login: undefined;
    SignUp: undefined;
    ProfileSetup: undefined;
    ProfileSetupDetails: undefined;
    IdealMatch: undefined;
    Characteristics: {
        email: string,
        password: string;
    };
    Profile: undefined;
};

const Stack = createNativeStackNavigator<RootStackParamList>();

export type Props = NativeStackScreenProps<RootStackParamList, 'Characteristics'>;



const App: React.FC<RootStackParamList> = () => {
    return (
      <NavigationContainer>
          <Stack.Navigator>
              <Stack.Screen name="Login" component={Login}
                             options={{ headerShown: false }}/>
              <Stack.Screen name="SignUp" component={SignUp}
                             options={{ headerShown: false }}/>
              <Stack.Screen name="ProfileSetup" component={ProfileSetup}
                             options={{ headerShown: false }}/>
              <Stack.Screen name="ProfileSetupDetails" component={ProfileSetupDetails}
                             options={{ headerShown: false }}/>
              <Stack.Screen name="IdealMatch" component={IdealMatch}
                             options={{ headerShown: false }}/>
              <Stack.Screen name="Characteristics" component={Characteristics}
                             options={{ headerShown: false }}
                             />
              <Stack.Screen name="Profile" component={Profile}
                             options={{ headerShown: false }}/>
          </Stack.Navigator>
      </NavigationContainer>
    );
}

我需要建议。我对 React Native 和 React 导航还比较陌生。

使用路径名和我推送的数据创建一个 route const 并将其传递给导航似乎可以修复它，但我不知道是否可以这样保留它：

const route = ["Characteristics", { email: formInput.email, password: formInput: password}];
navigation.navigate(...(route as never));

Answer 1

通过创建导航常量并从我的注册屏幕中删除 props: propsType arg 来修复它：

const navigation = useNavigation<StackNavigationProp<RootStackParamList>>();

我仍然想知道是否必须在堆栈的每个屏幕上创建一个新的导航常量？