Resumen
JsonTree muestra un value JSON o una matriz de entries con nombre. Proporciona todas las etiquetas de valores vacíos y de expansión/contracción para que tu aplicación controle el texto.
”Uso”
id, una label y un value JSON. Usa entradas cuando las etiquetas mostradas difieran de las claves almacenadas. De forma predeterminada, se expanden las profundidades 0 y 1. Anula shouldExpandNodeInitially={({ depth }) => depth === 0} para expandir solo la raíz; la expansión posterior corresponde a cada nodo.
getNodeHighlighting(keyPath) devuelve blue, red, partial-blue o undefined. onNodeValueClick recibe el texto mostrado: los valores hoja como cadenas y la etiqueta vacía correspondiente para cadenas, matrices y objetos vacíos. El árbol muestra datos y no los edita.
Cuando se proporciona onNodeValueClick, los valores son botones nativos nombrados por el texto mostrado. Tab mueve el foco a un valor; Intro, Espacio o un clic con el puntero lo activan. Sin la devolución de llamada, los valores siguen siendo texto no interactivo. Los botones de valor no envían los formularios que los contienen.
”Props”
string
requerido
Accessible label for the expand control on a collapsed node.
string
requerido
Accessible label for the collapse control on an expanded node.
string
requerido
Display text for an empty array.
string
requerido
Display text for an empty object.
string
requerido
Display text for an empty string.
JsonTreeEntry[]
Named entries with stable id, label, and JSON value fields. Supply entries or value, not both.
GetJsonNodeHighlighting
Returns blue, red, or partial-blue highlighting for a node key path.
((valueAsString: string) => void)
Called with the clicked value as displayed: leaf values as strings, and the empty label for empty strings, arrays, and objects.
((params: ShouldExpandNodeInitiallyProps) => boolean)
Chooses initial expansion from the node keyPath and depth. The default expands the first two depths.
JsonValue
JSON value to display. Supply value or entries, not both.