Here is the current code:
useEffect(() => {
dispatch(fetchMovieDetails(movieId!));
return () => dispatch(fetchMovieDetails(movieId!, "clear"));
}, [dispatch, movieId]);
Problem is that this code is giving me a very long error:
- Argument of type '() => () => (dispatch: Dispatch) => Promise<null | undefined>' is not assignable to parameter of type 'EffectCallback'.
- Type '() => (dispatch: Dispatch) => Promise<null | undefined>' is not assignable to type 'void | Destructor'.
- Type '() => (dispatch: Dispatch) => Promise<null | undefined>' is not assignable to type 'Destructor'.
- Type '(dispatch: Dispatch) => Promise<null | undefined>' is not assignable to type 'void | { [UNDEFINED_VOID_ONLY]: never; }'.
- Property '[UNDEFINED_VOID_ONLY]' is missing in type '(dispatch: Dispatch) => Promise<null | undefined>' but required in type '{ [UNDEFINED_VOID_ONLY]: never; }'.ts(2345)
I'm assuming TypeScript is asking for me to define a return type. So what should I do?
CodePudding user response:
return () => dispatch(fetchMovieDetails(movieId!, "clear"));
Typescript is pointing out that the cleanup function isn't supposed to return anything, but with the arrow function shorthand, you're returning whatever dispatch is returning.
You can fix this by adding in curly brackets to your function, so that there's no longer an implicit return:
return () => { dispatch(fetchMovieDetails(movieId!, "clear")); };