AlexStack AlexStack - 3 months ago 54
React JSX Question

Do I have to mount redux-form to the "form" key in the root of my state?

The getting started page says:

import { createStore, combineReducers } from 'redux'
import { reducer as formReducer } from 'redux-form'

const reducers = {
// ... your other reducers here ...
form: formReducer // <---- Mounted at 'form'
}
const reducer = combineReducers(reducers)
const store = createStore(reducer)


But the reduxForm() documentation says:


form : String [required]

the name of your form and the key to where your form's state will be mounted under the redux-form reducer


I am running the Simple Form example. I have this code:

var reduxFormReducer = reduxForm({
formKey: 'personal' // a unique identifier for this form
})(SimpleForm);

var reducer = combineReducers({
formKey: reduxFormReducer
});


But it shows this error:


Warning: Failed prop type: Required prop
form
was not specified in
Form(SimpleForm)
. in Form(SimpleForm) (created by Connect(Form(SimpleForm)))


I've tried this:

var reduxFormReducer = reduxForm({
form: 'formKey' // a unique identifier for this form
})(SimpleForm);

var reducer = combineReducers({
formKey: reduxFormReducer
});


It doesn't show that error but the edit fields are empty and can't change.

Answer

I Hope your missed in reducer, please use the key name as form

var reduxFormReducer = reduxForm({
  form: 'formKey'  // a unique identifier for this form
})(SimpleForm);

var reducer = combineReducers({
  form: reduxFormReducer // <- change formKey to form here 
});

refer: http://redux-form.com/6.0.2/docs/GettingStarted.md/

Update:

The form reducer. Should be given to mounted to your Redux state at form.

If you absolutely must mount it somewhere other than form, you may provide a getFormState(state) function to the reduxForm() decorator, to get the slice of the Redux state where you have mounted the redux-form reducer.

Comments