Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

120
Vistas
¿Una forma rápida de hacer referencia a un elemento en un componente React?

Tengo un componente que tiene un campo de entrada y un botón. Quiero agregar un controlador onclick en el botón que usa el valor de la entrada. Puedo hacer esto con querySelector, getElementbyId o tener un elemento de formulario principal, o cambiar la entrada a un componente. Pero lo que quiero saber es si hay una manera directa y fácil de referenciar el elemento.

 import React from "react"; export default class UserInput extends React.Component{ constructor(props){ super(props); this.doStuff = this.doStuff.bind(this); } doStuff(){ const inputValue = document.getElementById('new-task').value // I want to replace this // do stuff } render(){ return( <div id="user-input"> <input type="text" id="new-task"></input> <button type="button" onClick={this.doStuff}>Do Stuff!</button> </div> ) } }
about 4 years ago · Santiago Gelvez
1 Respuestas
Responde la pregunta

0

Creo que puedes hacerlo de esta manera. Solo pruébalo.

 import React from "react"; export default class UserInput extends React.Component{ constructor(props){ super(props); this.textInput = React.createRef(); this.doStuff = this.doStuff.bind(this); } doStuff(){ const inputValue = this.textInput } render(){ return( <div id="user-input"> <input type="text" id="new-task" ref={this.textInput}></input> <button type="button" onClick={this.doStuff}>Do Stuff!</button> </div> ) } }
about 4 years ago · Santiago Gelvez Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda