Fieldset Component

The <Fieldset> component is a way to contain related fields. This might not sound like much, but it's incredibly useful when creating reusable groups of controls. Here's an example:

// in render():
<Form model="user">
  <Fieldset model=".address">
    <Control.text model=".city" />
    <Control.text model=".state" />
    <Control.text model=".zip" />
  </Fieldset>
</Form>

If you extract the <Fieldset model=".address"> out into its own component, you can then reuse it inside any other <Form>:

const Address = () => (
  <Fieldset model=".address">
    <Control.text model=".city" />
    <Control.text model=".state" />
    <Control.text model=".zip" />
  </Fieldset>
);

// in render():
<Form model="user">
  <Address />
</Form>

<Form model="admin">
  <Address />
</Form>

(since: 1.4.0)

Prop Types

model="..." (required)

(String | Function): The string or tracker representing the model value of the entire form in the store.

You can also use partial models for <Control>, <Field>, and <Errors> components inside of <Fieldset> - they will be resolved to the fieldset's model.

In addition, you can use a partial model for <Fieldset> itself - it will resolve to the parent <Fieldset> (yes, you can nest fieldsets) or <Form> models.

component={...}

(Any) The component that the <Fieldset> should be rendered to (default: "div").

• For React Native, the View component is used to render the fieldset, if you import { Fieldset } from 'react-redux-form/native'.