cc3fc18076
* added packages reference menu item. * removed the draft flag. * Updated docs by running script.
5.1 KiB
+++
-----------------------------------------------------------------------
Do not edit this file. It is automatically generated by API Documenter.
-----------------------------------------------------------------------
title = "JsonExplorer" keywords = ["grafana","documentation","sdk","@grafana/ui"] type = "docs" +++
JsonExplorer class
JsonExplorer
JsonExplorer allows you to render JSON objects in HTML with a **collapsible** navigation.
Signature
export declare class JsonExplorer
Import
import { JsonExplorer } from '@grafana/ui';
Constructors
| Constructor | Modifiers | Description |
|---|---|---|
| constructor(json, open, config, key) | Constructs a new instance of the JsonExplorer class |
Properties
| Property | Modifiers | Type | Description |
|---|---|---|---|
| json | any |
Methods
| Method | Modifiers | Description |
|---|---|---|
| appendChildren(animated) | Appends all the children to children element Animated option is used when user triggers this via a click | |
| isNumberArray() | ||
| openAtDepth(depth) | Open all children up to a certain depth. Allows actions such as expand all/collapse all | |
| removeChildren(animated) | Removes all the children from children element Animated option is used when user triggers this via a click | |
| render(skipRoot) | Renders an HTML element and installs event listeners | |
| renderArray() | ||
| toggleOpen() | Toggles isOpen state |
constructor(json, open, config, key)
Constructs a new instance of the JsonExplorer class
Signature
constructor(json: any, open?: number, config?: JsonExplorerConfig, key?: string | undefined);
Parameters
| Parameter | Type | Description |
|---|---|---|
| json | any |
The JSON object you want to render. It has to be an object or array. Do NOT pass raw JSON string. |
| open | number |
his number indicates up to how many levels the rendered tree should expand. Set it to 0 to make the whole tree collapsed or set it to Infinity to expand the tree deeply |
| config | JsonExplorerConfig |
defaultConfig = { hoverPreviewEnabled: false, hoverPreviewArrayCount: 100, hoverPreviewFieldCount: 5 }Available configurations: #####Hover Preview * hoverPreviewEnabled: enable preview on hover * hoverPreviewArrayCount: number of array items to show in preview Any array larger than this number will be shown as Array[XXX] where XXX is length of the array. * hoverPreviewFieldCount: number of object properties to show for object preview. Any object with more properties that thin number will be truncated. |
| key | string | undefined |
The key that this object in it's parent context |
json property
Signature
json: any;
appendChildren method
Appends all the children to children element Animated option is used when user triggers this via a click
Signature
appendChildren(animated?: boolean): void;
Parameters
| Parameter | Type | Description |
|---|---|---|
| animated | boolean |
Returns:
void
isNumberArray method
Signature
isNumberArray(): boolean;
Returns:
boolean
openAtDepth method
Open all children up to a certain depth. Allows actions such as expand all/collapse all
Signature
openAtDepth(depth?: number): void;
Parameters
| Parameter | Type | Description |
|---|---|---|
| depth | number |
Returns:
void
removeChildren method
Removes all the children from children element Animated option is used when user triggers this via a click
Signature
removeChildren(animated?: boolean): void;
Parameters
| Parameter | Type | Description |
|---|---|---|
| animated | boolean |
Returns:
void
render method
Renders an HTML element and installs event listeners
Signature
render(skipRoot?: boolean): HTMLDivElement;
Parameters
| Parameter | Type | Description |
|---|---|---|
| skipRoot | boolean |
Returns:
HTMLDivElement
{HTMLDivElement}
renderArray method
Signature
renderArray(): Element;
Returns:
Element
toggleOpen method
Toggles isOpen state
Signature
toggleOpen(): void;
Returns:
void