Redux-form-lite NPM

redux-form-lite

A simple form manager for React and Redux. The API similarities to redux-form are intentional - this project is meant to take the best of redux-form while keeping it as lightweight and simple to use as possible!

Installation

Make sure you have react, redux and react-redux installed! Then simply:

yarn add redux-form-lite

Or for the oldschool:

npm i redux-form-lite --save

Quickstart

Mount the redux-form-lite reducer to your root reducer as reduxFormLite.

import { createStore, combineReducers } from 'redux';
import { reducer } from 'redux-form-lite';

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

const store = createStore(rootReducer);

Then simply wrap your desired form with the Form component.

import { Form, Field } from 'redux-form-lite';

const MyForm = (props) => (
  <Form name="contact">
    <div>
      <label htmlFor="name">Name</label>
      <Field name="name" component="input" type="text" />
    </div>
    <div>
      <label htmlFor="email">Email</label>
      <Field name="email" component="input" type="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 - there are examples for each use case.