jsontree — u_pbt_jsontree #

← Référence des composants · Sommaire du guide

jsontree affiche une valeur JSON comme un arbre repliable, coloré par type : un écran de configuration, une réponse d'API, un débogage d'intégration. Vous posez le texte JSON dans is_json, le composant le montre ; un clic sur un nœud rapporte son chemin (ue_node_clicked), un JSON invalide lève ue_error. Il ne modifie rien : c'est un VISUALISEUR.

▶ Le voir en vrai — Application de démonstration, tuile JSON tree, avec le code et cette page côte à côte.

En bref #

Démarrage rapide #

// Show an API response as a tree
uo_json.is_json = inv_rest.of_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

Propriétés #

Méthodes #

Événements #

Exemple #

Explorer la réponse d'une API #

// 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.of_response_text()
	uo_json.of_collapse_all()          // the reader opens what interests them
else
	uo_json.of_clear()
end if

Lire la valeur d'un nœud cliqué #

// ue_node_clicked of uo_json : the path is the one n_pbt_json reads
n_pbt_json lnv_json

// Read the value at the clicked path with n_pbt_json
lnv_json.of_load(/*json*/ uo_json.is_json)
st_value.text = lnv_json.of_get_string(/*path*/ as_path)

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

Chercher des mots entiers, casse comprise #

// 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")

Bonnes pratiques #

• C'est un visualiseur, pas un éditeur : il montre le JSON, il ne le change pas. Pour lire une valeur, donnez le chemin de ue_node_clicked à n_pbt_json.of_get_string sur le même texte, ou lisez of_selected_text.
• Un gros JSON reste fluide : seules les lignes à l'écran sont dessinées, une réponse de plusieurs centaines de Ko se parcourt au clavier sans attente. of_collapse_all d'abord reste le plus lisible.
• Un JSON invalide ne casse rien : ue_error le dit (avec la ligne et la colonne de la faute), l'arbre reste vide. C'est le retour à montrer, pas un plantage.
• Une clé vide ou qui contient / n'a pas de chemin : n_pbt_json ne sait pas l'adresser non plus. Deux clés identiques dans un même objet s'affichent toutes les deux ; le chemin désigne la première.
• De droite à gauche : un document JSON est un texte de gauche à droite, l'arbre le reste dans une application en RTL (seule la zone de recherche suit le sens de l'application).
• Le clavier reste à l'arbre : Entrée plie un bloc ou « clique » une feuille (ue_node_clicked), jamais le bouton par défaut de la fenêtre ; Échap ferme d'abord la zone de recherche ouverte, puis revient à la fenêtre ; les lignes fermantes (}, ]) ne sont pas des positions de la sélection ; Ctrl+C copie la sélection (of_copy).
• Très gros documents : au-delà de 1 500 000 lignes, le document est refusé avec ue_error plutôt que tronqué sans le dire. L'impression (of_print, of_print_to_pdf) sort le document en entier, jusqu'à 10 000 lignes.

Hérité du socle commun #

Ces membres existent sur tous les composants visuels — ils ne sont pas propres à celui-ci. Ils sont détaillés une seule fois, dans les chapitres transverses ; cette table dit seulement où les lire.

← Référence des composants · Sommaire du guide