Skip to content

Commit 5e757a7

Browse files
committed
Updated README.
1 parent 0f5e93b commit 5e757a7

File tree

1 file changed

+30
-0
lines changed

1 file changed

+30
-0
lines changed

README.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -179,6 +179,36 @@ The following props are passed to the widget component:
179179
- `placeholder`: The placeholder value, if any;
180180
- `options`: The list of options for `enum` fields;
181181

182+
## Custom SchemaField
183+
184+
**Warning:** This is a powerful feature as you can override the whole form behavior and easily mess it up. Handle with care.
185+
186+
You can provide your own implementation of the `SchemaField` base React component for rendering any JSONSchema field type, including objects and arrays. This is useful when you want to augment a given field type with supplementary powers.
187+
188+
To proceed so, you can pass a `SchemaField` prop to the `Form` component instance; here's a rather silly example wrapping the standard `SchemaField` lib component:
189+
190+
```js
191+
import SchemaField from "react-jsonschema-form/lib/components/fields/SchemaField";
192+
193+
const CustomSchemaField = function(props) {
194+
return (
195+
<div id="custom">
196+
<p>Yeah, I'm pretty dumb.</p>
197+
<SchemaField {...props} />
198+
</div>
199+
);
200+
};
201+
202+
render((
203+
<Form schema={schema}
204+
uiSchema={uiSchema}
205+
formData={formData}
206+
SchemaField={CustomSchemaField} />
207+
), document.getElementById("app"));
208+
```
209+
210+
If you're curious how this could ever be useful, have a look at the [Kinto formbuilder](https://github.com/Kinto/formbuilder) repository to see how it's used to provide editing capabilities to any form field.
211+
182212
## Development server
183213

184214
```

0 commit comments

Comments
 (0)