redux-formkit-redux-state-provider v4.0.0
redux-formkit-redux-state-provider
⚠️ ATTENTION ⚠️
By default Redux-formkit does not use Redux - obviously this is not communicated well by the name. For this reason I have created react-form-composer-redux-provider which is 100% compatible and I recommend switching to it.
Use this module to connect redux-formkit to redux.
Motivation
From version 3 onwards redux-formkit uses react state to store form values - it does not, by default, use Redux. This module makes it easy to configure redux-formkit to use redux for the form state.
Getting Started
Checkout example
To use it on you own project:
npm install --save redux-formkit-redux-state-provider
Usage
Combine formReducer
with your other reducers. Usually you will mount formReducer
under 'form'. (To mount it elsewhere pass the mount-point key to FormStateProvider
using prop formReducerNamespace
).
Add one instance of the FormStateProvider
anywhere below the react-redux provider and above forms in the component tree.
import React from "react";
import ReactDOM from "react-dom";
import { createStore, combineReducers } from 'redux';
import { Provider } from 'react-redux';
import FormStateProvider from "redux-formkit-redux-state-provider";
import { formReducer } from 'redux-formkit';
import MyForm from './my-form.jsx';
const reducer = combineReducers({
form: formReducer // Use formReducerNamespace prop mount point is not 'form'
})
const store = createStore(
reducer, undefined,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
const FormContainer = () => {
return (
<Provider store={store}>
<FormStateProvider /* formReducerNamespace="my-forms" */ >
<MyForm/>
</FormStateProvider>
</Provider>
);
};
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago