react-painlessform
Uses React 16.3 Context
Painless Form is a bunch of React Components that helps you:
- Validate form via custom validator or Yup.Schema or combined validator!
- Calculate fields
- Use typescript for type checking in fields!
- Create reusable form parts with own Validation & Transform
without any configs only declarative style.
Install
npm install --save react-painlessform
Documentation
Examples
import { createFormFactory } from "react-painlessform";
interface IModel {
field: number;
field2: string;
}
const { Form, Field } = createFormFactory<IModel>();
const MyForm = (props) => {
return (
<Form initValues={values} onModelChange={onModelChange}>
<div>
<Field name={"field"}>
{({ name, value, onClick, onChange, rest }) => (
<input name={name} value={value} onClick={onClick} onChange={onChange} {...rest} />
)}
</Field>
<Field name={"field2"}>
{({ name, value, onClick, onChange, rest }) => (
<input name={name} value={value} onClick={onClick} onChange={onChange} {...rest} />
)}
</field>
<button type={"submit"}>Submit</button>
</div>
</Form>
);
}