Estoy usando React JS, Redux, React-Redux, Redux-Thunk.

Archivo: Acions.js: aquí están mis funciones de acción Redux:

 export function setSuccess(data){ return{ type: "SET_SUCCESS", payload: data }; } export function setMessage(data){ return{ type: "SET_POSTS", payload: data }; } export const listMyBlogPosts = (userID, abortController) =>{ return (dispatch) =>{ axios.get(`http://locahost:5000/timeline/posts/${userID}`, {signal: abortController}) .then((response) =>{ dispatch(setSuccess(true)); dispatch(setMessage(response.data.message)); }).catch((error) =>{ console.log("err: ", error); dispatch(setSuccess(false)); dispatch(setMessage(`${error}`)); }); } };

Aquí es donde estoy usando la función anterior:

Archivo: ABC.js:

 function ABC({ someCheck }){ const abortController = useRef(new AbortController()); const dispatch = useDispatch(); console.log(“ABC component”); useEffect(() =>{ navigation.addListener("focus", () =>{ dispatch(listMyBlogPosts(userID, abortController.current.signal)); console.log("focus is being run!"); }); return () => abortController.current.abort(); }, []); }

En el componente ABC, me sale el siguiente error:

Si elimino el gancho useEffect, ¿no obtengo el error anterior?

Cómo arreglar este error ?