react-object-forms
Install
npm install --save @hiogopariz/react-object-forms
or
yarn add @hiogopariz/react-object-forms
Usage
Create your form inputs once, use it everywhere
import React from 'react';
import { createFormTemplate } from 'react-object-forms';
function CustomInput({value, onChange, ...props}) {
return <input value={value} onChange={(e) => onChange(e.target.value)} {...props} />;
}
function CustomFormContainer({ onSubmit, fields }) {
return (
<form onSubmit={onSubmit}>
{fields}
<input type='submit' />
</form>
);
}
const myFormTemplate = createFormTemplate({
components: [['input', CustomInput]],
wrapper: CustomFormContainer,
});
const MyCustomForm = myFormTemplate.generate({
name: 'input',
email: {
component: 'input',
props: {
type: 'email',
},
},
});
function App() {
const onSubmit = (data) => console.log(data);
const defaultValues = {
name: '',
email: '',
};
return <MyCustomForm onSubmit={onSubmit} defaultValues={defaultValues} />;
}
License
MIT © HiogoPariz