jsontree — u_pbt_jsontree #

← Komponentenreferenz · Inhalt des Handbuchs

jsontree zeigt einen JSON-Wert als einklappbaren Baum, nach Typ gefärbt: ein Konfigurationsbildschirm, eine API-Antwort, ein Integrations-Debug. Sie setzen den JSON-Text in is_json, die Komponente zeigt ihn; ein Klick auf einen Knoten meldet seinen Pfad (ue_node_clicked), ungültiges JSON löst ue_error aus. Sie ändert nichts: sie ist ein BETRACHTER.

▶ Live sehen — Demoanwendung, Kachel JSON tree, mit dem Code und dieser Seite nebeneinander.

Auf einen Blick #

Schnellstart #

// Show an API response as a tree
uo_json.is_json = inv_rest.is_response_text

// Fold everything, then let the user open what interests them
uo_json.of_collapse_all()

// ue_node_clicked : the path of the node clicked ("lines/1/sku"), the path of
// n_pbt_json -> of_get_string(as_path) on the same text reads its value

Eigenschaften #

Methoden #

Ereignisse #

Beispiel #

Eine API-Antwort erkunden #

// Fetch the order : the tree shows the response, or empties on a failure
if inv_rest.of_get(/*url*/ "https://api.example.com/orders/4152") = 200 then
	uo_json.is_json = inv_rest.is_response_text
	uo_json.of_collapse_all()          // the reader opens what interests them
else
	uo_json.of_clear()
end if

Den Wert eines angeklickten Knotens lesen #

// Instance variable of the window : the response, parsed ONCE by n_pbt_json
n_pbt_json inv_doc

// When the response arrives : the tree shows it, n_pbt_json parses the same text once
uo_json.is_json = inv_rest.is_response_text
inv_doc.of_load(/*json*/ inv_rest.is_response_text)

// ue_node_clicked of uo_json : the value at the clicked path, nothing parsed again
st_value.text = inv_doc.of_get_string(/*path*/ as_path)

// or, without a second parser : the value of the selected leaf, decoded
st_value.text = uo_json.is_selected_text

Ganze Wörter suchen, Groß-/Kleinschreibung beachtet #

// Whole words only, with the same case : "id" is not found inside "user_id"
uo_json.ib_find_match_case = true
uo_json.ib_find_whole_word = true
uo_json.of_search(/*query*/ "id")

Die Faltungen behalten, wenn die Antwort aktualisiert wird #

// Local variables
string ls_layout

// The folds, the selected node and the line at the top, kept before the new text
ls_layout = uo_json.is_layout
uo_json.is_json = inv_rest.is_response_text

// The same blocks fold again ; a path the new text no longer has is ignored
uo_json.is_layout = ls_layout

Ein Menü auf einem Knoten #

// ue_node_rclicked of uo_json : the node is selected, open YOUR menu at that point of the screen
uo_menu.of_show(/*x*/ al_x, /*y*/ al_y)

// ue_item_selected of uo_menu : copy the value, or the path for n_pbt_json
choose case as_keys
	case "copy"
		uo_json.of_copy()
	case "copypath"
		uo_json.of_copy_path()
end choose

Bewährte Praxis #

• Ein Betrachter, kein Editor: er zeigt das JSON, er ändert es nicht. Um einen Wert zu lesen, übergeben Sie den Pfad von ue_node_clicked an n_pbt_json.of_get_string auf demselben Text, oder lesen Sie is_selected_text.
• Ein großes JSON bleibt flüssig: nur die Zeilen auf dem Bildschirm werden gezeichnet, eine Antwort von mehreren hundert KB lässt sich ohne Wartezeit mit der Tastatur durchgehen. Zuerst of_collapse_all bleibt am lesbarsten.
• Ungültiges JSON zerbricht nichts: ue_error sagt es (mit Zeile und Spalte des Fehlers), der Baum bleibt leer. Das ist die Rückmeldung, die man zeigt, kein Absturz.
• Jeder Schlüssel hat einen Pfad: ein / oder ~ darin wird ~1 bzw. ~0 geschrieben (JSON Pointer), und n_pbt_json liest ihn so — paths/~1users~1{id} für eine OpenAPI-Spezifikation. Ein LEERER Schlüssel ist eine leere Ebene (a//b, / für den an der Wurzel). Eine Ausnahme, die ib_selected_addressable meldet: alles unter dem zweiten von zwei gleichen Schlüsseln (der Pfad bezeichnet den ersten).
• Von rechts nach links: ein JSON-Dokument ist ein Text von links nach rechts, und der Baum bleibt es in einer RTL-Anwendung (nur das Suchfeld folgt der Richtung der Anwendung).
• Die Tastatur bleibt beim Baum: Eingabe klappt einen Block ein oder „klickt“ ein Blatt (ue_node_clicked), nie die Standardschaltfläche des Fensters; Esc schließt zuerst ein offenes Suchfeld und geht dann an das Fenster; die schließenden Zeilen (}, ]) sind keine Positionen der Auswahl; Strg+C kopiert die Auswahl (of_copy) oder das mit der Maus markierte Textstück; die Leertaste klappt einen Block ein und rollt die Ansicht nie; die Menütaste (Umschalt+F10) löst ue_node_rclicked aus.
• Sehr große Dokumente: über 1.500.000 Zeilen wird das Dokument mit ue_error abgelehnt, statt stillschweigend abgeschnitten zu werden. Der Druck (of_print, of_print_to_pdf) gibt aus, was aufgeklappt ist, bis zu 10.000 Zeilen: ein eingeklappter Block wird eingeklappt gedruckt (vorher of_expand_all, um alles zu drucken).

Vom gemeinsamen Sockel geerbt #

Diese Mitglieder gibt es bei jeder visuellen Komponente — sie sind nicht dieser eigen. Sie werden einmal in den übergreifenden Kapiteln beschrieben; diese Tabelle sagt nur, wo man sie liest.

← Komponentenreferenz · Inhalt des Handbuchs