json-edit-react
Advanced tools
Comparing version 1.0.0 to 1.1.0
{ | ||
"name": "json-edit-react", | ||
"version": "1.0.0", | ||
"version": "1.1.0", | ||
"description": "React component for editing or viewing JSON/object data", | ||
@@ -5,0 +5,0 @@ "main": "build/index.cjs.js", |
@@ -13,2 +13,3 @@ # json-edit-react | ||
- self-contained — rendered with plain HTML/CSS, so no dependance on external UI libraries | ||
- provide your own [custom component](#custom-nodes) to integrate specialised UI for certain data. | ||
@@ -50,10 +51,17 @@ **[Explore the Demo](https://carlosnz.github.io/json-edit-react/)** | ||
```js | ||
```jsx | ||
import { JsonEditor } from 'json-edit-react' | ||
// In your React components: | ||
<JsonEditor data={ myDataObject } { ...props }> | ||
<JsonEditor | ||
data={ myData } | ||
onUpdate={ ({newData} ) => { | ||
// Set "myData" state, plus | ||
// any desired side-effects. | ||
}} | ||
{ ...otherProps } /> | ||
``` | ||
You are responsible for maintaining the data state — in your `onUpdate` function, use the `newData` property to set `data`, which should update inside the editor. | ||
## Usage | ||
@@ -73,3 +81,3 @@ | ||
The only *required* value is `data`. | ||
The only *required* value is `data`. | ||
@@ -399,2 +407,3 @@ | prop | type | default | description | | ||
- **1.1.0**: Don't manage data state within component | ||
- **1.0.0**: | ||
@@ -401,0 +410,0 @@ - [Custom nodes](#custom-nodes) |
185825
419