Así que hay una función que se parece a esto

 function eventListener(e) { if (!modalRef.current.contains(e.target)) { setOpenModal(false); } }

Y agrego un detector de eventos para escuchar burbujas de eventos en el cuerpo al inicio

 useEffect(() => { document.body.addEventListener("click", eventListener, true); return () => { document.body.removeEventListener("click", eventListener, true); }; }, []);

Y cuando el componente está escuchando el estado de burbuja

 useDidMountEffect(() => { console.log("hello the buble is", buble); if (buble) { document.body.addEventListener("click", eventListener, true); } else { console.log("I'm in false mode"); document.body.removeEventListener("click", eventListener, true); } }, [buble]);

Pero lamentablemente no puedo eliminarlo, prueba que no se está eliminando.

He leído estos sitios web

1. https://www.edureka.co/community/71646/find-event-listeners-node-when-debugging-from-javascript-code

2. No se pueden eliminar todos los detectores de eventos

También he usado la función de flecha pero no funcionó. Y también useDidMountEffect es un enlace personalizado para que la función no se ejecute al inicio, sino cuando la monto