Encountered an issue while trying to utilize Typescript in ReactNavigation and received an error from my IDE (WebStorm).
Here is my Navigator
:
export type RootStackParamList = {
AppStack: undefined;
AuthStack: undefined;
};
const RootStack = createStackNavigator<RootStackParamList>();
const Navigation: React.FunctionComponent = () => {
return (
<RootStack.Navigator>
<RootStack.Screen name="AuthStack" component={AuthStack} />
<RootStack.Screen name="AppStack" component={AppStack} />
</RootStack.Navigator>
);
}
And here is my LoginScreen
within the AuthStack
:
type NavigationProps = StackNavigationProp<RootStackParamList>;
const LoginScreen = () => {
const navigation = useNavigation<StackNavigationProp<RootStackParamList>>();
const requestLogin = () => {
navigation.navigate('AppStack'); // Seeing an error in 'AppStack' in the IDE
}
}
Although the app runs smoothly, the IDE still displays an error message:
Argument types do not match parameters
.
This error is not related to eslint.
Any ideas on resolving this issue?