import useForm from 'use-form-react' const Form = () => { const { onSubmit, onChange, inputs } = useForm('sampleForm', { initialValues: { 'name': '' }, callback: (inputs) => console.log(inputs) } ) return ( <div> <div>Hello {inputs.name}</div> <form onSubmit={onSubmit}> <input name="name" value={inputs.name} onChange={onChange} /> <button type="submit">Sign in</button> </form> </div> ); }

import React, { useEffect } from 'react'; import useForm from 'use-form-react' const SignUp = () => { const options = { initialValues: { 'email': '', 'password1': '', 'password2': '' }, callback: () => console.log('it works'), debug: true } const { onSubmit, onChange, inputs, dirty, submitting, reset } = useForm('myAdvanceFormName', option) useEffect(() => { if(inputs.password1!==inputs.password2) console.log('password not matched') }); return ( <form onSubmit={onSubmit}> <input type='email' name="email" value={inputs.email} placeholder="Email" required onChange={onChange} /> <input type='password' name="password1" value={inputs.password1} placeholder="Password" onChange={onChange} required /> <input type='password' name="password2" value={inputs.password2} placeholder="Confirm password" onChange={onChange} required /> <button disabled={!dirty || error || submitting} type="submit">Sign up</button> </form> ); }