score:0

you don't necessarily need useeffect here.

here is how you can implement such thing:

declare a state to hold form values:

const [formdata, setformdata] = usestate({})

declare function to set the state:

const handlechange = (name, value) => {
    setformdata({...formdata, [name]: value})
}

input onchange to capture:

// handlechange has two parameters
<input
    type="text"
    placeholder="first name"
    name="firstname"
    id='firstname'
    value={props.data.firstname}
    onchange={(event) => handlechange('firstname', event.target.value)}
/>

function for calling post axios post request

const handlesubmit = () => {
    //check for validations code here

    // if validations are right then post request here
    // this will give you all the fields like firstname: "", lastname: ""
    let requestbody = {
        ...formdata
    }
    axios.post("url", requestbody).then((res)=> {
        //your code here
    })
}

Related Query

More Query from same tag