		@@ -18,14 +18,23 @@ redux-saga-final-form


		## Usage

		in your form component

		```javascript
		import { useListener } from 'redux-saga-final-form';
		import { Form } from "react-final-form";

		```javascript
		export const SettingsComponent = () => {
		const formListener = useListener(DOMAIN_SAVE_SETTINGS, DOMAIN_SAVE_SETTINGS_SUCCESS, DOMAIN_SAVE_SETTINGS_ERROR);
		return <Form initialValues={initialValues} onSubmit={formListener} validate={validate}>
		...
		</Form>
		}
		export const MyComponent = () => {
		const formListener = useListener(SUBMIT_START_ACTION, SUBMIT_SUCCESS_ACTION, SUBMIT_FAIL_ACTION);
		return (
		<Form
		onSubmit={formListener}
		render={(formRenderProps) => (
		<form onSubmit={formRenderProps.handleSubmit}>
		...
		</form>
		)}
		/>
		);
		};
		```
		@@ -36,3 +45,4 @@
		```javascript
		import { finalFormSaga } from 'redux-saga-final-form';
		import { finalFormSaga } from 'redux-saga-final-form';
		import createSagaMiddleware from "redux-saga";

		@@ -44,1 +54,10 @@ const sagaMiddleware = createSagaMiddleware();

		SUBMIT_START_ACTION example:

		```javascript
		export const submitStatrAction = (payload: { formField1: string }) => ({
		type: SUBMIT_START_ACTION
		payload
		});
		```

src/index.ts

		@@ -29,3 +29,3 @@ import { useDispatch } from 'react-redux';
		pendingCallbacks.delete(cbInfo.toClear)
		cbInfo.callback();
		cbInfo.callback(action.payload);
		}
		@@ -35,2 +35,2 @@
		yield takeEvery((action: any) => !!pendingCallbacks.get(action.type), handleEvent);
		}
		}

redux-saga-final-form - npm Package Compare versions

New alerts