Usé tres useEffect para controlar diferentes estados y agregar/eliminar detectores de eventos. Pero no estoy seguro de que sea una mejor práctica o no.
useEffect(() => { window.addEventListener('keydown', keyPressHandle) return () => { window.removeEventListener('keydown', keyPressHandle) } }, []) useEffect(() => { // do sth on state_one }, [state_one]) useEffect(() => { // do sth on state_two }, [state_two])Sí, esta es una buena práctica y Reactjs también la recomienda.
Sugerencia: utilice varios efectos para separar las preocupaciones
Como dijo Ryan, esta es la forma correcta de hacerlo.
Controlar múltiples estados en un solo useEffect() es extremadamente complicado y, a veces, imposible, según lo que desee lograr.
Nada en la matriz de dependencia significa que el código se ejecutará cuando se monte el componente y es el equivalente funcional de componentDidMount().
Cuando un valor está en la matriz, los efectos secundarios se activan cada vez que se actualiza el valor.
Como probablemente te darás cuenta, usar el mismo useEffect() para ambas cosas sería imposible.