Quickstart

Mount the redux-forms reducer to your root reducer as reduxForms.

import { createStore, combineReducers } from 'redux';
import reduxFormsReducer from 'redux-forms';

const rootReducer = combineReducers({
  // ... your other reducers
  reduxForms: reduxFormsReducer,
});

const store = createStore(rootReducer);

Create a component wrapped in the field decorator.

import { field } from 'redux-forms-react';

const Input = props => (
  <input type="text" {...props.input} />
);

export default field(Input);

Then simply wrap your desired form with the Form component and you're ready to go!

import { Form } from 'redux-forms-react';

import Input from './Input';

const MyForm = props => (
  <Form name="contact">
    <div>
      <label htmlFor="name">Name</label>
      <Input name="name" />
    </div>
    <div>
      <label htmlFor="email">Email</label>
      <Input name="email" />
    </div>
    <button type="submit">Submit</button>
  </Form>
);

export default MyForm;

That's it! This is how you mount the most basic form. For more advanced usage, check out the API docs below.

results matching ""

    No results matching ""