Decorator for π Final Form that will call provided callbacks when submission is attempted, succeeds, or fails.
npm install --save final-form final-form-submit-listener
or
yarn add final-form final-form-submit-listener
import { createForm } from 'final-form'
import createDecorator from 'final-form-submit-listener'
// Create Form
const form = createForm({ onSubmit })
// Create Decorator
const decorator = createDecorator()
// Decorate form
const undecorate = decorator(form)
// Use form as normal
import React from 'react'
import { Form, Field } from 'react-final-form'
import createDecorator from 'final-form-submit-listener'
const submitListener = createDecorator({
beforeSubmit: formApi => { /* do something before */ },
afterSubmitSucceeded: formApi => { /* do something on success */ },
afterSubmitFailed: formApi => { /* do something on fail */ },
})
...
<Form
onSubmit={submit}
decorators={[ submitListener ]} // <--------- π
validate={validate}
render={({ handleSubmit }) =>
<form onSubmit={handleSubmit}>
... inputs here ...
</form>
}
/>
createDecorator: ({ beforeSubmit?: BeforeSubmit, afterSubmitSucceeded?: AfterSubmit, afterSubmitFailed?: AfterSubmit) => Decorator
A function that takes optional callback functions and provides a π Final Form Decorator
that will listen for submission events and call the callbacks.
A callback that is given the πFinal Form instance (FormApi
).
A callback that is given the πFinal Form instance (FormApi
). If it returns false
, the submission will be aborted, and none of the "after submit" callbacks will fire.