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

115
Vistas
Cómo enviar el mismo formulario varias veces en React

Tengo una aplicación de reacción que requiere que se envíen los mismos formularios varias veces. A continuación se muestra mi código para la clase del panel de control.

Los valores se ingresan en formularios separados y se presiona el botón, lo que envía los valores del campo de entrada del formulario a otro componente para su procesamiento. Una vez hecho esto, me gustaría poder volver a enviar el formulario (por ejemplo: simplemente haga clic en el botón nuevamente) y que el procesamiento comience de nuevo.

El campo formSubmit (en this.state) se establece en falso inicialmente, pero se establece en verdadero cuando se envía el formulario. Una vez hecho esto, la línea {this.state.formSubmit && } (cerca del final) garantiza que el procesamiento comience cuando el valor de formSubmit se establezca en verdadero. Una vez que se realiza el procesamiento, asumo que simplemente establecer el valor de formSubmit en falso nuevamente permitirá que el formulario se envíe nuevamente, pero aún no sé cómo hacerlo.

 class App extends React.Component { constructor(props) { super(props); this.state = { BO_course: "", BO_max_speed: "", formSubmit: false }; this.handleInput = this.handleInput.bind(this); this.handleFormSubmit = this.handleFormSubmit.bind(this); } handleInput (event) { const value = event.target.value; console.log(value); this.setState({ ...this.state, [event.target.name]: value, }); } handleFormSubmit (event) { console.log("Submitting form"); event.preventDefault(); this.setState({formSubmit: true}); // this.setState({formSubmit: false}) } render () { return ( <div className="App"> <div className="container"> <form onSubmit={this.handleFormSubmit}> <label className="name"> Name <input className="inputstyleright" type="text" name="nameinput" onChange={this.handleInput} /> </label> </form> <form onSubmit={this.handleFormSubmit}> <label className="surname"> Surname <input className="inputstyleright" type="text" name="surnameinput" onChange={this.handleInput} /> </label> <input className="submitbutton" type="submit" value="Submit"/> </form> <div className="topleft">Control Panel</div> <div className="square"></div> </div> {/* only evaluates to true if the form has been submitted */} {this.state.formSubmit && <RM search1={this.state} />} </div> ); } } export default App;
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Logré resolverlo actualizando el botón para usar una función onClick:

 <input className="submitbutton" type="submit" value="Submit" onClick={()=>getRM(this.state)}/>

y cambiando

 {this.state.formSubmit && <RM search1={this.state} />}

para sólo

 {<RM />}

También moví la función que estaba llamando en el

 <RM search1={this.state} />

parte fuera de la propia clase RM. La función ahora es llamada por onClick en el botón, por ejemplo: "getRM ()"

about 4 years ago · Juan Pablo Isaza 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