Skip to content

Commit b9f806b

Browse files
committed
doc: Add Inspector example.
1 parent 204539b commit b9f806b

File tree

1 file changed

+65
-0
lines changed

1 file changed

+65
-0
lines changed

core/README.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,71 @@ export default function Demo() {
150150
}
151151
```
152152

153+
Inspector
154+
155+
```tsx mdx:preview
156+
import React from 'react';
157+
import JsonView from '@uiw/react-json-view';
158+
159+
const object = [
160+
{
161+
"_id": "56dcf573b09c217d39fd7621",
162+
"name": "Howard Christensen",
163+
"email": "[email protected]",
164+
"phone": "+1 (830) 529-3176",
165+
"address": "511 Royce Street, Hilltop, Tennessee, 9712"
166+
},
167+
{
168+
"_id": "56dcf57323630b06251e93cd",
169+
"name": "Eleanor Lynn",
170+
"email": "[email protected]",
171+
"phone": "+1 (911) 576-2345",
172+
"address": "547 Dearborn Court, Trona, California, 8629"
173+
},
174+
{
175+
"_id": "56dcf5738279cac6b081e512",
176+
"name": "Baxter Mooney",
177+
"email": "[email protected]",
178+
"phone": "+1 (954) 456-3456",
179+
"address": "349 Cumberland Walk, Washington, Alaska, 3154"
180+
},
181+
{
182+
"_id": "56dcf57303accabd43740957",
183+
"name": "Calhoun Tyson",
184+
"email": "[email protected]",
185+
"phone": "+1 (818) 456-2529",
186+
"address": "367 Lyme Avenue, Ladera, Louisiana, 6292"
187+
},
188+
{
189+
"_id": "56dcf57391ea6a9d1f60df0c",
190+
"name": "Judith Jimenez",
191+
"email": "[email protected]",
192+
"phone": "+1 (950) 587-3415",
193+
"address": "269 Bogart Street, Sultana, Vermont, 7833"
194+
},
195+
{
196+
"_id": "56dcf5735a7a0718a61f294d",
197+
"name": "Newman Lawson",
198+
"email": "[email protected]",
199+
"phone": "+1 (814) 484-2827",
200+
"address": "969 Conduit Boulevard, Lowell, Oregon, 4118"
201+
}
202+
]
203+
204+
const customTheme = {
205+
'--w-rjv-background-color': '#fff',
206+
'--w-rjv-border-left-width': 0,
207+
'--w-rjv-color': '#881391',
208+
'--w-rjv-type-int-color': '#881391',
209+
};
210+
211+
export default function Demo() {
212+
return (
213+
<JsonView value={object} style={customTheme} quotes="" displayDataTypes={false} enableClipboard={false} />
214+
)
215+
}
216+
```
217+
153218
## Online Editing Theme
154219

155220
Online custom style example, please check in the [documentation website](https://uiwjs.github.io/react-json-view/)

0 commit comments

Comments
 (0)