Comment importer un snippet YAML de composant Canvas
La fonctionnalité permettant de copier-coller du code YAML a eu quelques évolutions : la copie d’écran et désormais la copie de composants ! Voici un guide étape par étape pour importer facilement un composant qui vous a été fourni sous forme de Snippet YAML.
Pour ce guide nous allons utiliser le composant suivant : notification-toaster
Ouvrir votre application
Ouvrez l’application dans laquelle nous souhaitez insérer le composant en mode édition.
Copiez le code YAML
Récupérez le code YAML et copiez le dans votre presse-papier (Ctrl +C) :

Coller le code YAML
Retournez dans l’éditeur, allez dans l’onglet “Composants” du menu Arborescence.

A cette étape, si votre application ne comporte aucun composant et que vous tentez de coller le code YAML, vous aurez droit à un message d’erreur :

Pas de panique, voici la solution pour le contourner:
-
Cliquez sur “nouveau composant”
-
Faites un clic droit sur le composant nouvellement créé et sélectionnez “coller”

Le composant est importé ! Il ne reste plus qu’à supprimer le composant vide que nous avons du créer précédemment :

Tester le composant
Pour tester le composant, il ne reste plus qu’à retourner dans la partie “écrans” de l’arborescence et d’insérer le composant via le menu insérer:

Avec ce composant, le code d’un écran de démo est fourni, il suffit de le coller avec un Ctrl+V ou depuis un clic droit sur n’importe quel écran :

Échanger autour de cet article
Les commentaires utilisent Giscus et GitHub Discussions. Le service externe n’est contacté qu’après activation.