@source4society/react-scepter-redux-form-decorator
v1.0.0
Published
Decorator to hook up form presentation components to a redux-form handler
Downloads
2
Readme
react-scepter-redux-form-decorator
Decorator to hook up form presentation components to a redux-form handler in SCEPTER projects and to dispatch an action upon form submission
Installation
npm install -S @source4society/react-scepter-redux-form-decorator
or
yarn add @source4society/react-scepter-redux-form-decorator
Usage
Wrap your presentational form component that uses redux-form fields in this component to hook it up to redux form processing and validation functionality.
You will need to supply a unique formName
, a function to calculate the initialValues
and a FormComponent
with redux-form Field
components inside as mandatory props.
Prop list:
formName: PropTypes.string.isRequired, // Unique form name used by redux-form
initialValues: PropTypes.func.isRequired, // function that returns an immutable object with key/value pairs of default values matching your field names from your presentational component
onSubmit: PropTypes.func, // Optional. A function to override what happens when the form is submitted will receive the formValues argument containing key/value pair of field values in the form.
validationRoutineFunction: PropTypes.func, // Optional. A function to override what happens on the validation step
FormComponent: PropTypes.any.isRequired, // A form component that uses redux-form Field
components
When the form is submitted, then the onSubmit routine will be called. The default behavior is to dispatch a SCEPTER_FORM_POST action. This object looks like the following:
{
type: SCEPTER_FORM_POST,
formValues,
formName,
initialValues,
}
You can listen for this action in reducers/sagas and handle accordingly. This action is only dispatched when the form passes validation.