¿Puedo memorizar una función setter desde un contexto React (useContext)

Question

Estoy tratando de usar useEffect para recuperar datos cuando un componente se monta de la siguiente manera:

useEffect(() => {
    axios.get(myUrl)
        .then(response => {
            setName(response.name);
            setAge(response.age);
        }).catch(error => {
            console.log(error);
        });
}, [myUrl, setName, setAge]);

setName y setAge provienen de un contexto de la siguiente manera:

import MyContext from './context';

const MyComponent = props => {
    const {
        setName,
        setAge
    } = useContext(MyContext);

Este problema es que las funciones, las matrices y los objetos se registran como dependencias "modificadas" en una llamada useEffect, por lo que termina en un bucle infinito donde está obteniendo esos datos una y otra y otra vez. ¿Puedo memorizar una función de un contexto para que solo se llame ese efecto una vez?

Nota: el consumidor de mi contexto está varios niveles por encima de este componente, así que supongo que no hay nada que pueda hacer allí.

reactjs react-hooks

0

Brady Dowling 13 feb. 2020 a las 03:48

Answer 1

No hay forma de memorizar una función desde un contexto.

Dicho esto, puede usar un enlace personalizado para useMount, ya sea importándolo de react-use o simplemente mirando el código fuente allí y declarándolo usted mismo. A continuación se muestra cómo definir useMount y useEffectOnce y luego utilizar useMount como solución alternativa:

    const useEffectOnce = (effect) => {
        useEffect(effect, []);
    };

    const useMount = (fn) => {
        useEffectOnce(() => {
            fn();
        });
    };

    useMount(() => {
        axios.get(myUrl)
            .then(response => {
                setName(response.name);
                setAge(response.age);
            }).catch(error => {
                console.log(error);
            });
    });

Con este enfoque, no necesita cambiar nada sobre su declaración de contexto, proveedor de contexto o consumidor de contexto.

0

Brady Dowling 20 feb. 2020 a las 19:58

Answer 2

Creo que debe definir contexto personalizado vinculado a algo como userId. Esto le proporcionará un identificador estable que cambiará solo cuando sea necesario.

1

zoonman 13 feb. 2020 a las 01:06

¿Puedo memorizar una función setter desde un contexto React (useContext)

2 respuestas

Preguntas relacionadas

Nuevas preguntas

reactjs