Form Initialization

The Form Constructor can take 2 arguments in input.

• First Constructor Argument
• Second Constructor Argument

• Constructor Usage
• Initialization Methods
• Execute code on Form Init

First Constructor Argument

The first argument represent the fields data with their props.

Provide an object which expects the following properties:

Fields Definition

Fields Properties

Fields Event Hooks & Event Handlers

Validation Properties

Validate fields according to the choosen validation plugin

Second Constructor Argument

The second argument represents the form plugins and options.

Provide an object which expects the following properties:

Form Event Hooks & Event Handlers

Constructor Usage

You can mix all the objects you need

import Form from 'mobx-react-form';

... // define all needed objects

// using unified fields properties definition
new Form({ fields });

// using validators with plugins, bindings and unified fields properties definition
new Form({ fields }, { plugins, bindings });

// using form options and separated fields properties definition
new Form({ values, labels, handlers, ... }, { options });

// using validators with plugins and separated fields properties definition
new Form({ values, labels, handlers, rules, ... }, { plugins });

// etc...

Initialization Methods

setup(), options(), plugins(), bindings(), handlers(), hooks().

Normally you have to pass the fields properties to the constructor, otherwise you can implement one of these methods above inside your extended Form Class.

For example, using the setup() method you can define the fields properties:

import Form from 'mobx-react-form';

class MyForm extends MobxReactForm {

  setup() {
    // same of: new MyForm({ fields, values, labels,  ... });
    return { fields, values, labels, ... };
  }
}

The methods have to return an object with all needed props/data.

This can be done with options, plugins, bindings, handlers and hooks as well.

The object returned from the methods will be merged to the object provieded to the constructor when initializing the instance.