Estoy escribiendo un enlace que recibe un HTMLElement como argumento. Me gustaría hacerlo para que pueda aceptar incluso solo una id y luego encontrar el elemento por sí solo.

Ejecuto document.getElementById() dentro de un useEffect en el gancho.
De esta forma, se consulta el DOM solo después de que el componente que llama al gancho se haya representado en el DOM real.
Y guardo el elemento de inmediato en reaccionar ref.

Si ejecuto mi aplicación y navego para renderizar el componente con el gancho, todo funciona perfectamente. Pero si continúo navegando para que el componente se desmonte y luego navego hacia atrás para volver a montarlo, la aplicación falla.

Después de investigar un poco, descubrí que el problema es que, si bien el elemento devuelto por document.getElementById es el mismo en ambos casos (porque la identificación es la misma), Node.isConnected devuelve true en el primer caso y false cuando ocurre el bloqueo. .

¿Alguien sabe a qué puede deberse esta diferencia?
Tenga en cuenta que después del primer montaje correcto, el componente se desmonta y se monta como nuevo.

PD: sería genial si pudiera proporcionar una respuesta teórica en lugar de requerir un ejemplo reproducible mínimo, ya que en este momento no tengo acceso a mi computadora portátil y, sin embargo, no puedo dejar de obsesionarme con este problema.