0
126
VistasEl clic del botón registra la etiqueta i en lugar del botón en sí
Tengo un botón y quiero capturar su 'id' cuando se hace clic en él.
<button id={props.id} onClick={props.handleClick} className="btn btn-circle" > <i class="fas fa-angle-down"></i> </button > Cuando registro el evento console.log(event.target.id); en mi función handleClick, devuelve el 'id' de la etiqueta i (que es solo una cadena vacía) si hago clic en el medio del botón. Si hago clic en los lados del botón, mi función handleClick funciona según lo previsto.
Así es como se ve el botón como referencia 
¿Cómo debo arreglar esto? Supongo que puedo agregar el mismo atributo 'id' a la etiqueta i, pero me preguntaba si había una solución mejor.
·
Juan Pablo Isaza
2 Respuestas
Responde la pregunta0
Podrías usar currentTarget en su lugar:
console.log(event.currentTarget.id); Esto devolverá el objetivo currentTarget al que ha adjuntado su función onClick , no el target que activa el evento.
·
Juan Pablo Isaza
Denunciar
0
también puede usar esta forma de obtener el valor de identificación
import { render } from "react-dom"; import React, { Component } from "react"; import "./styles.css"; class Click extends Component { constructor(props) { super(props); } click(e) { let id = e.target.attributes.getNamedItem("id").value; alert(id); } render() { return ( <button onClick={this.click} id="This is id"> Click Here </button> ); } } export default Click;
·
Juan Pablo Isaza
Denunciar
Responde la pregunta