Quiero que la ventana emergente, el modal o el brindis aparezcan justo donde se hizo clic en el botón para reaccionar. Pero no pude encontrar nada sobre esto. Todo lo que pude encontrar fue algo así como que aparecía en el centro o en la parte superior o algo predefinido. Supongo que todavía no está bien donde se hizo clic en el botón. ¿Cómo debería abordar esto?
https://reactjs.org/docs/events.html#mouse-events
El parámetro MouseEvent en la devolución de llamada onClick contiene las coordenadas x e y del clic.
const handleClick = (mouseEvent) => { console.log(`x = ${mouseEvent.clientX}, y = ${mouseEvent.clientY}`) }React proporciona 3 coordenadas diferentes de cliente, página y pantalla. El ejemplo anterior utiliza las coordenadas del cliente. Puede leer más sobre sus diferencias en MDN Web Docs
const box = document.querySelector('#box'); box.addEventListener('click', function(event) { console.log(`Horizontal: ${clientX}, Vertical: ${clientY}`); // Take Position Current onClick });Puede configurar la parte superior por el cliente Y, a la izquierda por el cliente X del detector de eventos