mobx-forms

A simple form manager for React and Mobx.

> Heavily inspired by and based on Redux Form! Be sure to check it out if you're a Redux fan.

TODO

- [ ] namespace types
- [ ] add docs

ROADMAP

1. finish the api (mainly submitting/async validation)
4. better README :blush:

$3

npm i --save mobx-forms

$3

Use Provider from mobx-react and supply the form store to it as mobxForms.

``javascript import { FormsStore } from 'mobx-forms'; import { Provider } from 'mobx-react';

import YourApp from './YourApp';

const Root = () => ;

export default Root;`

Initializing a form:

`javascript import React from 'react'; import { observer } from 'mobx-react';

import { mobxForm, Field, FieldArray } from 'mobx-forms';

const Form = props => (


    My field:
          name="myField"
      component={Input}
    />
    My flat array:
          name="flatarray"
      component={FlatArray}
      flat
    />
    My multi-field array:
          name="deeparray"
      component={DeepArray}
    />

);

export default mobxForm({ form: 'myForm', })(Form);`Example of aFlatArray and DeepArray:

`javascript const FlatArray = observer(props =>


    {props.fields.map((index) =>
              name="flatfield"
        key={index}
        index={index}
        component="input"
      />
    )}


);
const DeepArray = observer(props =>
  

    {props.fields.map(index =>
      
        name:
                  name="name"
          index={index}
          component={Input}
        />
        surname:
                  name="surname"
          index={index}
          component="input"
        />
      

    )}
    
    
  

);

That's it! You will get the form's instance as a prop named form.

Field` accepts either a string or a component. It will receive the necessary properties. More detailed docs incoming.