Interaction au chargement

Aperçu

Le Au chargement l'interaction est une fonctionnalité cruciale dans Avonni Dynamic Components qui vous permet d'exécuter des actions automatiquement juste avant que votre composant devienne visible sur la page. Pendant la phase d'initialisation du composant, vous disposez d'opportunités uniques pour récupérer des données essentielles, exécuter la logique d'installation et préparer des variables, garantissant que votre composant dispose de tout ce dont il a besoin au moment où il s'affiche.

Préparer votre composant

Considérez l'interaction « Au chargement » comme l'équipe de préparation qui prépare la scène avant la représentation principale. Elle s'exécute une fois lorsque le composant est chargé avant que des éléments visuels n'apparaissent.

Cela la rend idéale pour :

Précharger les données essentielles : Récupérer des enregistrements spécifiques nécessaires à l'affichage ou à l'utilisation immédiate.
Initialiser les variables : Définir des valeurs par défaut ou calculées pour les variables qui contrôlent le comportement ou l'affichage du composant.
Exécuter des flux de configuration : Exécuter une logique en arrière-plan (via un Flow autolaunché) pour déterminer les états initiaux ou effectuer une configuration complexe.
Affichage conditionnel: Définir des valeurs de variables pour piloter la visibilité.

Point clé

Parce que « Au chargement » s'exécute avant rendu, vous ne pouvez pas référencer des composants sur la toile (en utilisant @ComponentName) dans ses actions. Il fonctionne uniquement sur les données et les ressources d'initialisation (comme les variables d'entrée ou globales).

Quand « Au chargement » est-il le plus utile ?

Alors que la définition du Nom API de l'objet cible donne accès à l'enregistrement courant via $Component.record sur les pages d'enregistrement, l'interaction « Au chargement » est essentielle dans de nombreux autres scénarios :

Récupération des enregistrements liés : Obtenir des données liées à l'enregistrement principal (par ex., récupérer le compte parent lors de la consultation d'un contact).
Chargement de données pour modales/panneaux : De manière cruciale, lors de l'ouverture d'un autre Dynamic Component dans une modale ou un panneau (en utilisant « Open Dynamic Component Dialog/Panel »), « Au chargement » à l'intérieur du composant modal/panneau est utilisé pour récupérer les données de l'enregistrement spécifique en se basant sur un ID qui lui est transmis. (Voir l'exemple ci-dessous).
Récupération d'enregistrements de configuration spécifiques : Charger des données à partir d'enregistrements connus comme les Custom Metadata ou les Settings.
Exécution de calculs/agrégations initiaux : Utiliser « Execute Flow » pour calculer des KPI, compter des enregistrements liés ou exécuter une logique complexe avant d'afficher les résultats.
Chargement de configuration externe : Utiliser « Execute Flow » pour récupérer des paramètres ou des données depuis d'autres systèmes (si votre Flow le prend en charge).

Actions disponibles dans « Au chargement »

Vous pouvez configurer une ou plusieurs actions à exécuter séquentiellement lors de l'événement « Au chargement » :

Récupérer des enregistrements

Ce que cela fait : Récupère un enregistrement Salesforce unique par son ID et le stocke dans une variable.

Quand l'utiliser

Vous avez besoin d'afficher ou de travailler avec les données d'un enregistrement spécifique
Ouverture d'une modale/panneau pour afficher les détails d'un enregistrement particulier
Récupération d'un enregistrement lié (par ex., obtenir le compte parent pour un contact)
Charger un enregistrement pour édition dans un formulaire

Pourquoi choisir Récupérer des enregistrements plutôt que Exécuter Flow

Vous avez seulement besoin des données d'un enregistrement
Aucun calcul ou logique requis
Configuration plus simple
Meilleure performance pour une récupération basique

Exécuter Flow

Ce que cela fait : Exécute un Flow Salesforce autolaunché qui peut effectuer des opérations complexes et retourner des résultats.

Quand l'utiliser

Vous avez besoin d'une logique ou de calculs complexes avant d'afficher les données
Récupération de plusieurs enregistrements ou de données agrégées
Effectuer des transformations ou des validations de données
Interroger des enregistrements avec des critères de filtre complexes
Appeler des services externes ou des API
Vérifier des permissions ou une logique conditionnelle
Obtenir des données de configuration depuis plusieurs sources

Pourquoi choisir Exécuter Flow plutôt que Récupérer des enregistrements

Vous avez besoin de plus que les données brutes d'un seul enregistrement
Des filtrages complexes, un tri ou plusieurs requêtes sont nécessaires
Des calculs ou transformations de données sont nécessaires
La logique métier doit s'exécuter avant d'afficher le contenu
Plusieurs sources de données doivent être combinées

Biométrie

Ce que cela fait : Demande une authentification biométrique au niveau de l'appareil (empreinte digitale, reconnaissance faciale, etc.) à l'utilisateur avant d'autoriser l'accès au composant.

Quand l'utiliser :

Vous devez vérifier l'identité de l'utilisateur avant d'afficher des données sensibles
Ajouter une couche de sécurité supplémentaire pour des informations confidentielles
Des exigences de conformité exigent une vérification biométrique
Créer des applications mobiles avec une sécurité renforcée (Salesforce Mobile App)
Protéger des opérations à haute valeur ou restreintes

Étapes de configuration

L'interaction Au chargement nécessite une configuration pour déterminer quelles actions s'exécutent lorsque votre composant se charge. Ci-dessous les paramètres et options disponibles.

Ouvrir le panneau Interactions

Lors de l'édition de votre Dynamic Component dans le Component Builder, localisez et cliquez sur l' Interactions icône/bouton dans le panneau latéral gauche. Cela ouvre le panneau principal où vous gérez toutes les interactions du composant.

Ajouter l'interaction « Au chargement »

Dans le panneau Interactions, cliquez sur le bouton « Ajouter une interaction Au chargement ». Cela ajoute la section d'événement dédiée « Au chargement » à votre configuration, prête à recevoir des actions.

Choisir le type d'action

Sélectionnez soit Récupérer des enregistrements , Exécuter Flow ou Biométrie

Configurer les détails de l'action

Pour Récupérer des enregistrements:
- Variable d'enregistrement : Sélectionnez une ressource de Variable d'Enregistrement prédéfinie (du bon type d'objet) où les données récupérées seront stockées.
- Nom API de l'objet : Choisissez l'objet que vous souhaitez récupérer (par ex., Contact).
- ID d'enregistrement : Spécifiez l'ID de l'enregistrement à récupérer. Cela est souvent lié à :
  - Une Variable d'entrée (si ce composant est ouvert par un autre, transmettant un ID).
  - Un paramètre d'URL (@recordId).
  - Un champ de $Component.record (par ex., $Component.record.AccountId).
- Champs : Sélectionnez les champs spécifiques que vous souhaitez récupérer.
Pour Exécuter Flow:
- Nom API du Flow : Sélectionnez votre Flow autolaunché .
- Variables d'entrée du Flow (optionnel) : Mappez des valeurs (statiques, paramètres d'URL, ressources) aux entrées de votre Flow.
- Variables de sortie (optionnel) : Mappez les sorties de votre Flow aux ressources de Variable dans votre Dynamic Component

Exemple : Chargement des données d'un Contact dans une modale d'édition

Ce que nous construisons

Nous créons un système à deux composants qui permet aux utilisateurs de modifier des enregistrements Contact dans une boîte de dialogue modale :

Composant A - Liste de contacts (page principale)

Affiche une liste de contacts dans un tableau de données
Chaque ligne a un bouton « Modifier »
Cliquer sur « Modifier » ouvre une boîte de dialogue modale

Composant B - Modale d'édition (boîte de dialogue contextuelle)

S'ouvre comme une superposition modale lorsque « Modifier » est cliqué
Charge automatiquement les données du Contact sélectionné
Affiche des champs modifiables pour le Contact
Dispose d'un bouton « Enregistrer » pour mettre à jour l'enregistrement

Configuration

Composant A (liste de contacts)

Il contient une Avonni List ou un Data Table affichant les contacts.
Chaque contact dans le Data Table inclut un bouton « Modifier », que vous pouvez ajouter comme nouvelle colonne en sélectionnant le type bouton dans les paramètres du tableau.

Le bouton « Modifier » a une interaction « Au clic » utilisant « Open Dynamic Component Dialog ».

Composant B (modale d'édition) :

Créer une variable d'entrée

Créez une Variable Texte nommée inputContactId. Rendez-la "Disponible pour l'entrée". Celle-ci reçoit l'ID depuis le Composant A.

Pourquoi ? Le inputContactId La Variable Texte reçoit l'ID du Contact sélectionné depuis le Composant A (la liste de contacts) lorsque le Composant B (la boîte de dialogue modale) est ouvert. La marquer comme Disponible pour l'entrée permet au Composant A de transmettre l'ID du Contact, que le Composant B utilise pour récupérer et afficher le bon enregistrement Contact pour l'édition.

Créer une Variable d'enregistrement

Créez une Variable d'enregistrement nommée contactToEdit. Définissez son Nom API de l'objet sur Contact.

Pourquoi ? Le contactToEdit La Variable d'Enregistrement stocke les données de l'enregistrement Contact spécifique en cours d'édition dans la boîte de dialogue modale. Elle permet au composant de récupérer, afficher et mettre à jour les données du Contact (par ex., Prénom, Email) en se basant sur l'ID transmis depuis la liste de contacts. Cela garantit que la modale travaille avec le bon enregistrement.

Ajouter l'interaction « Au chargement » au Composant B

Sélectionnez le Composant B (niveau supérieur).
Ajoutez une action à l' Au chargement événement

Pourquoi ? Le Au chargement l'interaction s'exécute automatiquement lorsque le Composant B (la boîte de dialogue modale) se charge, avant qu'il ne devienne visible. Cela vous permet de récupérer les données de l'enregistrement Contact spécifique (en utilisant l'ID transmis depuis le Composant A) et de les stocker dans la contactToEdit Variable d'Enregistrement. Cela garantit que la modale est remplie avec les bonnes données pour l'édition dès son ouverture.

Configurer l'action « Récupérer des enregistrements »

Type d'action : Récupérer des enregistrements.
Variable d'enregistrement : Sélectionnez {!contactToEdit}.
Nom API de l'objet : Contact.
ID d'enregistrement : Liez ceci à votre variable d'entrée : {!inputContactId}.

Pourquoi ? Le Récupérer des enregistrements action récupère les données de l'enregistrement Contact spécifique lorsque le Composant B (la boîte de dialogue modale) se charge. En définissant la Variable d'Enregistrement sur contactToEdit, les données récupérées y sont stockées pour l'édition. Le Nom API de l'objet spécifie l'objet Contact, et lier l'ID d'enregistrement à inputContactId assure que l'action récupère le bon enregistrement Contact en se basant sur l'ID transmis depuis le Composant A (la liste de contacts).

Ajouter des champs d'entrée

Avec l' Au chargement interaction configurée, ajoutez des champs d'entrée au Composant B (la boîte de dialogue modale) pour modifier l'enregistrement Contact. Dans le Component Builder, allez à l'onglet Champs du menu du composant, glissez les champs souhaités sur la toile et liez-les à la contactToEdit Variable d'Enregistrement pour afficher et modifier les données du Contact correctes.

Pourquoi ? Les champs d'entrée permettent aux utilisateurs de voir et modifier les données du Contact (par ex., Prénom, Email) dans la modale. Lier les champs à la Variable d'Enregistrement contactToEdit garantit qu'ils sont remplis avec les données de l'enregistrement Contact spécifique récupéré lors de l' Au chargement interaction, permettant une édition précise.

Ajouter un bouton Enregistrer

Ajoutez un bouton au Composant B (la boîte de dialogue modale). Configurez une Au clic interaction avec l'action Mettre à jour depuis la Variable d'Enregistrement ciblant la {!contactToEdit} Variable d'Enregistrement.

Pourquoi ? Le bouton Enregistrer permet aux utilisateurs d'enregistrer les modifications apportées aux données du Contact dans la modale. L' Mettre à jour depuis la Variable d'Enregistrement action utilise la contactToEdit Variable d'Enregistrement pour mettre à jour l'enregistrement Contact dans Salesforce avec les valeurs de champs modifiées, garantissant la persistance des changements.

Interaction depuis le Composant A

Pour permettre au Modifier bouton dans le Data Table du Composant A (liste de contacts) d'ouvrir le Composant B (boîte de dialogue modale), suivez ces étapes :

Sélectionnez le Data Table: Dans le Composant A, choisissez le Data Table dans le Component Builder.
Aller à l'onglet Interactions: Naviguez vers l' Interactions onglet dans le menu du composant.
Ajouter une action de ligne: Sous Actions de ligne, ajoutez une nouvelle action pour le Modifier bouton (créé précédemment).
Définir le type d'interaction: Choisissez Open Dynamic Component Dialog comme type d'interaction.
Sélectionner le Composant B: Choisissez le Composant B (la boîte de dialogue modale) comme composant cible à ouvrir.
Configurer la variable d'entrée:
- Sélectionnez la variable inputContactId (définie comme Disponible pour l'entrée dans le Composant B).
- Définissez la valeur sur Enregistrement : Id pour transmettre l'ID du Contact depuis la ligne sélectionnée.

Pourquoi ? Cette interaction lie le Modifier bouton dans chaque ligne du Data Table au Composant B, transmettant l'ID du Contact sélectionné à la variable inputContactId. Le Composant B utilise cet ID dans son Au chargement interaction pour récupérer et afficher le bon enregistrement Contact pour l'édition, assurant un processus d'édition fluide et précis.

Résultat

Lorsque l'utilisateur clique sur « Modifier » dans le Composant A, le Composant B s'ouvre. Avant Que le Composant B s'affiche, son interaction « Au chargement » se déclenche, utilise le inputContactId transmis pour récupérer l'enregistrement Contact complet via « Récupérer des enregistrements », et remplir la contactToEdit variable. Les champs d'entrée (liés à contactToEdit) puis s'affichent déjà remplis avec les données du contact correct et prêts à être modifiés.

Considérations importantes

Flows autolaunchés uniquement : « Execute Flow » nécessite des Flows autolaunchés.
Source de l'ID d'enregistrement : Assurez-vous d'avoir un ID valide pour « Récupérer des enregistrements » (souvent à partir d'une variable d'entrée ou d'un paramètre d'URL).
Exécution une seule fois : S'exécute une seule fois avant le rendu.
Pas de références aux composants de la toile : Impossible de référencer des composants sur la toile (par ex., @MyComponent) pendant « Au chargement ».
Performance : Gardez les actions « Au chargement » efficaces afin d'éviter de retarder l'affichage du composant.
Gestion des erreurs : Mettez en œuvre la gestion des erreurs dans les Flows si utilisés.

En résumé

L'interaction Au chargement est votre outil essentiel pour préparer les données et initialiser les variables avant avant que votre Dynamic Component ne se rende. Utilisez Récupérer des enregistrements pour récupérer des enregistrements spécifiques (en particulier des données liées ou des données pour des modales/panneaux) et Exécuter Flow pour une logique d'installation plus complexe, des calculs ou la récupération des paramètres de configuration.

Mis à jour il y a 23 jours

Ce contenu vous a-t-il été utile ?