Ejemplo:
const [foo, setFoo] = useState(0) const [bar, setBar] = useState(0) useEffect(() => { computation(foo, bar) }, [foo]) ¿El valor de la bar dentro del cierre useEffect estará obsoleto? Lo pregunto porque en una de mis aplicaciones, olvidé incluir la bar en la matriz de deps y parecía que todavía estaba actualizada.
Más o menos, pero no exactamente. La obsolescencia no será realmente un problema, pero sí lo será si el enlace se ejecuta , porque está usando useEffect en lugar de algo como useCallback .
Usar [foo] significa que se ejecutará cuando cambie foo . Si su otro código está configurado para que cada vez que cambie la bar , foo también cambie o cambie, entonces cuando el componente se vuelva a renderizar, los nuevos valores de ambos serán vistos por el gancho de efecto.
Pero si cambia de bar sin cambiar foo , el efecto no se ejecutará en absoluto.
Tendría un problema de cierre obsoleto, si bar cambiara cuando foo no lo hiciera, si estuviera usando useCallback o useMemo , entre otros, porque guardan un valor en una variable externa (que luego se puede llamar o pasar a otros componentes).
No estará obsoleto dentro del efecto, pero el efecto no se volverá a ejecutar cuando cambie la bar .
Aquí debe comprender cuándo funcionará useEffect,
useEffect(() => { computation(foo, bar) } ) -> Se ejecutará cuando cambie cualquiera de los estados del componente.
useEffect(() => { computation(foo, bar) }, [foo]) -> Se ejecutará durante el montaje y durante los cambios de estado 'foo'.
useEffect(() => { computation(foo, bar) }, []) -> Se ejecutará solo mientras el componente se monta por primera vez.
Entonces, si no incluye la dependencia. Se llamará a useEffect cada vez que cambie cualquier estado del componente.