No puedo entender cómo cumplir con los requisitos de dependencia faltantes de useEffect en el componente Dashboard, donde solo quiero buscar Trabajos una vez en el procesamiento. La adición de fetchJobs como una dependencia o la eliminación de la matriz de dependencia provoca una repetición infinita.
Tablero.js:
... import { useGlobalContext } from "../context/appContext"; const Dashboard = () => { const { user, logout, fetchJobs } = useGlobalContext(); useEffect(() => { fetchJobs(); }, []); return ( ... ); }; export default Dashboard;appContext.js:
... const initialState = { user: null, jobs: [] }; const AppContext = React.createContext(); export const AppProvider = ({ children }) => { const [state, dispatch] = useReducer(reducer, initialState); ... const fetchJobs = async () => { try { const { data } = await API.get(`/jobs`); dispatch({ type: FETCH_JOBS_SUCCESS, payload: data.jobs }); } catch (err) { console.log(err); } }; ... return ( <AppContext.Provider value={{ ...state, login, logout, fetchJobs }} > {children} </AppContext.Provider> ); }; export const useGlobalContext = () => { return useContext(AppContext); };Intenté implementarlo con useCallback, pero tampoco funcionó. ¿Este problema posiblemente esté relacionado con el uso de useContext?
Sé que puede ignorar el error de pelusa colocando // eslint-disable-next-line justo encima de la matriz de dependencia, pero no me parece que sea la forma correcta.
Gracias por tu ayuda, te lo agradezco.
Codesandbox: https://codesandbox.io/s/gracious-hamilton-ekftz3