Tengo un formulario React. Este formulario tiene un botón. Este es el botón de enviar. Si hago clic en este botón, ejecute la primera función (submitHandler) cuyo puntero está en el formulario.
Quiero agregar un segundo botón al formulario "botón Atrás". Este botón debe ejecutar otra función pero no la primera función
Ambos botones deben estar en el mismo formulario
Formulario.js
import React, { useState } from "react"; import "./Form.css"; const Form = (props) => { const submitHandler = (event) => { event.preventDefault(); console.log('Some console log now from Submit Hanlder') }; const secondFunction = event =>{ console.log('Some other console log') } return ( <form onSubmit={submitHandler}> <div className="new-expense__controls"> <div className="new-expense__control"> <label>Title</label> <input type="text" /> </div> <div className="new-expense__control"> <label>Amount</label> <input type="number" /> </div> <div className="new-expense__control"> <label>Date</label> <input type="date" /> </div> <div className="new-expense__actions"> <button type="submit">Submitting</button> <buton>Second button....</buton> </div> </div> </form> ); }; export default Form;simplemente use type="button" :
<button type="button">Second button....</button>Puede agregar un evento onClick al segundo botón para ejecutar la segunda función:
<button onClick={() => secondFunction()}>Second button....</button>Nota: el evento onClick en reactjs tiene una C mayúscula.
const secondFunction = event => { event.preventDefault(); console.log('Some other console log') }