Estoy tratando de eliminar y agregar el mismo detector de eventos en el evento onClick React, de modo que cuando se hace clic en el elemento de destino, se agrega un detector de eventos al elemento principal. En el siguiente clic, debería eliminarse para no apilarse.

En este momento, sé que se crea una nueva función con cada clic, por lo que la referencia es diferente en agregar y eliminarEventListener y es por eso que no funciona.

No se como solucionarlo y agradeceria ayuda.

En este momento funciona según lo previsto, solo que el detector de eventos no se elimina con el siguiente clic, y se acumulan...

Agregaré que no se puede cambiar con el estado y el estilo en línea, ya que este elemento no es accesible en jsx, pero es un elemento svg dentro de un gráfico de una biblioteca externa.

¡Gracias!

 const barClick = (event) => { const target = event.target as SVGRectElement; // Function to change back const changeBack = () => { target.style.fill = cvar('colorPrimary'); console.log('changed'); }; // Remove to not stack target.parentElement?.removeEventListener( 'click', changeBack ); // Change color target.style.fill = cvar('colorSecondary'); // Add event so color is back to the same once clicked outside target.parentElement?.addEventListener( 'click', changeBack ); };