Estoy mostrando un menú desplegable que se representa al hacer clic en un icono. El mismo menú desplegable también se representa al hacer clic derecho en otro div. Se necesitan las coordenadas x e y del evento de clic del mouse para mostrar el menú desplegable en la posición correcta. Este es el código del icono:
<Icon onClick={this.handleOnClick} onKeyDown={this.handleOnClick}/>
Cuando navego con el teclado y presiono Entrar en el icono, se llama a la función de representación para el menú desplegable, pero como el evento no tiene una coordenada X e Y, el menú desplegable se representa en la parte superior izquierda de la página en (0, 0 ).
¿Hay alguna manera de obtener la posición del botón cuando estoy navegando con el teclado?
Tengo este trabajo usando:
document.activeElement.getBoundingClientRect();
En el evento Key, invoqué este método. Este método proporciona un objeto que contiene coordenadas x e y junto con la altura, el ancho y otras propiedades similares.