On-Load-Interaktion

Übersicht

Das Beim Laden Die Interaktion „Beim Laden“ ist eine entscheidende Funktion in Avonni Dynamic Components, mit der Sie Aktionen ausführen können automatisch direkt bevor Ihre Komponente auf der Seite sichtbar wird. Während der Initialisierungsphase der Komponente haben Sie einmalige Gelegenheiten, wichtige Daten abzurufen, Einrichtungslogik auszuführen und Variablen vorzubereiten, sodass Ihre Komponente alles hat, was sie beim Rendern benötigt.


Vorbereitung Ihrer Komponente

Betrachten Sie die Interaktion „Beim Laden“ als das Aufbauteam, das die Bühne vor der Hauptvorstellung vorbereitet. Sie wird einmal ausgeführt, wenn die Komponente geladen wird bevor sichtbare Elemente erscheinen.

Das macht sie ideal für:

  • Vorabladen wichtiger Daten: Abrufen bestimmter Datensätze, die für die sofortige Anzeige oder Nutzung benötigt werden.

  • Initialisierung von Variablen: Festlegen von Standard- oder berechneten Werten für Variablen, die das Verhalten oder die Anzeige der Komponente steuern.

  • Ausführen von Einrichtungs-Flows: Ausführen von Hintergrundlogik (über einen automatisch gestarteten Flow), um Anfangszustände zu bestimmen oder komplexe Einrichtungsaufgaben vorzunehmen.

  • Bedingte Anzeige: Festlegen von Variablenwerten zur Steuerung der Sichtbarkeit.

Wichtiger Punkt


Wann ist „Beim Laden“ am nützlichsten?

Während das Festlegen des Zielobjekt-API-Namens Zugriff auf den aktuellen Datensatz über $Component.record auf Datensatzseiten bietet, ist die Interaktion „Beim Laden“ in vielen anderen Szenarien unerlässlich:

  • Abrufen verwandter Datensätze: Abrufen von Daten, die mit dem primären Datensatz verknüpft sind (z. B. Abrufen des übergeordneten Accounts beim Anzeigen eines Kontakts).

  • Laden von Daten für Modale/Seitenleisten: Wesentlich, beim Öffnen einer anderen Dynamic Component in einem Modal oder Panel (mittels „Dynamische Komponente Dialog/Panel öffnen“), wird „Beim Laden“ innerhalb der Modal-/Panel-Komponente verwendet, um die Daten des spezifischen Datensatzes anhand einer hineingegebenen ID zu laden. (Siehe Beispiel unten).

  • Abrufen spezifischer Konfigurationsdatensätze: Laden von Daten aus bekannten Datensätzen wie Custom Metadata oder Einstellungen.

  • Ausführen anfänglicher Berechnungen/Aggregationen: Verwendung von „Flow ausführen“, um KPIs zu berechnen, verwandte Datensätze zu zählen oder komplexe Logik auszuführen, bevor Ergebnisse angezeigt werden.

  • Laden externer Konfiguration: Verwendung von „Flow ausführen“, um Einstellungen oder Daten aus anderen Systemen abzurufen (falls Ihr Flow dies unterstützt).


Verfügbare Aktionen innerhalb von „Beim Laden“

Sie können eine oder mehrere Aktionen konfigurieren, die nacheinander innerhalb des Ereignisses „Beim Laden“ ausgeführt werden:

Datensätze abrufen

Was es tut: Ruft einen einzelnen Salesforce-Datensatz anhand seiner ID ab und speichert ihn in einer Variable.

Wann zu verwenden

  • Sie müssen die Daten eines bestimmten Datensatzes anzeigen oder damit arbeiten

  • Öffnen eines Modals/Panels, um Details für einen bestimmten Datensatz anzuzeigen

  • Abrufen eines zugehörigen Datensatzes (z. B. Abrufen des übergeordneten Accounts für einen Kontakt)

  • Laden eines Datensatzes zum Bearbeiten in einem Formular

Warum Get Records gegenüber Execute Flow wählen

  • Sie benötigen nur die Daten eines einzelnen Datensatzes

  • Keine Berechnungen oder Logik erforderlich

  • Einfachere Konfiguration

  • Bessere Leistung bei unkompliziertem Abruf

Flow ausführen

Was es tut: Führt einen automatisch gestarteten Salesforce-Flow aus, der komplexe Operationen durchführen und Ergebnisse zurückgeben kann.

Wann zu verwenden

  • Sie benötigen komplexe Logik oder Berechnungen, bevor Daten angezeigt werden

  • Abrufen mehrerer Datensätze oder aggregierter Daten

  • Durchführen von Datenumwandlungen oder Validierungen

  • Abfragen von Datensätzen mit komplexen Filterkriterien

  • Aufrufen von externen Diensten oder APIs

  • Überprüfen von Berechtigungen oder bedingter Logik

  • Abrufen von Konfigurationsdaten aus mehreren Quellen

Warum Execute Flow gegenüber Get Records wählen

  • Sie benötigen mehr als nur die Rohdaten eines einzelnen Datensatzes

  • Komplexe Filterung, Sortierung oder mehrere Abfragen erforderlich

  • Berechnungen oder Datenumwandlungen nötig

  • Geschäftslogik muss vor der Anzeige ausgeführt werden

  • Mehrere Datenquellen müssen zusammengeführt werden

Biometrie

Was es tut: Fordert vom Benutzer eine gerätebasierte biometrische Authentifizierung (Fingerabdruck, Face ID usw.), bevor der Zugriff auf die Komponente erlaubt wird.

Wann zu verwenden:

  • Sie müssen die Identität des Benutzers verifizieren, bevor vertrauliche Daten angezeigt werden

  • Hinzufügen einer zusätzlichen Sicherheitsschicht für vertrauliche Informationen

  • Compliance-Anforderungen verlangen biometrische Verifizierung

  • Erstellung mobiler Apps mit erhöhter Sicherheit (Salesforce Mobile App)

  • Schutz von wertvollen oder eingeschränkten Vorgängen


Konfigurationsschritte

Die Interaktion Beim Laden erfordert Konfiguration, um festzulegen, welche Aktionen beim Laden Ihrer Komponente ausgeführt werden. Nachfolgend sind die verfügbaren Einstellungen und Optionen aufgeführt.

1

Öffnen Sie das Interaktionen-Panel

Während Sie Ihre Dynamic Component im Component Builder bearbeiten, suchen und klicken Sie auf das Interaktionen Symbol/Schaltfläche im linken Bereich. Dadurch wird das Hauptpanel geöffnet, in dem Sie alle Komponenteninteraktionen verwalten.

2

Fügen Sie die Interaktion „Beim Laden“ hinzu

Klicken Sie im Interaktionen-Panel auf die Schaltfläche „Beim Laden-Interaktion hinzufügen“. Dadurch wird der dedizierte Abschnitt für das Ereignis „Beim Laden“ zu Ihrer Konfiguration hinzugefügt, der bereit ist, Aktionen aufzunehmen.

3

Aktionstyp wählen

Wählen Sie entweder Datensätze abrufen , Flow ausführen oder Biometrie

4

Aktionsdetails konfigurieren

  • Für Datensätze abrufen:

    • Datensatzvariable: Wählen Sie eine vordefinierte Datensatzvariable-Ressource (vom korrekten Objekttyp), in der die abgerufenen Daten gespeichert werden.

    • Objekt-API-Name: Wählen Sie das Objekt, das Sie abrufen möchten (z. B. Kontakt).

    • Datensatz-ID: Geben Sie die ID des abzurufenden Datensatzes an. Diese ist häufig gebunden an:

      • Eine Eingabevariable (wenn diese Komponente von einer anderen geöffnet wird, die eine ID übergibt).

      • Einen URL-Parameter (@recordId).

      • Ein Feld von $Component.record (z. B. $Component.record.AccountId).

    • Felder: Wählen Sie die spezifischen Felder aus, die Sie abrufen möchten.

  • Für Flow ausführen:

    • Flow-API-Name: Wählen Sie Ihren automatisch gestarteten Flow.

    • Flow-Eingabevariablen (optional): Ordnen Sie Werte (statisch, URL-Parameter, Ressourcen) den Eingaben Ihres Flows zu.

    • Ausgabevariablen (optional): Ordnen Sie die Ausgaben Ihres Flows zu Variablenressourcen in Ihrer Dynamic Component zu


Beispiel: Laden von Kontaktdaten in einem Bearbeitungs-Modal

Was wir bauen

Wir erstellen ein Zwei-Komponenten-System, das es Benutzern ermöglicht, Kontaktdatensätze in einem Modal-Dialog zu bearbeiten:

Komponente A - Kontaktliste (Hauptseite)

  • Zeigt eine Liste von Kontakten in einer Datentabelle an

  • Jede Zeile hat eine „Bearbeiten“-Schaltfläche

  • Klicken auf „Bearbeiten“ öffnet einen Modal-Dialog

Komponente B - Bearbeitungs-Modal (Popup-Dialog)

  • Öffnet sich als Modal-Overlay, wenn „Bearbeiten“ angeklickt wird

  • Lädt automatisch die Daten des ausgewählten Kontakts

  • Zeigt editierbare Felder für den Kontakt an

  • Hat eine „Speichern“-Schaltfläche, um den Datensatz zu aktualisieren

Einrichtung

Komponente A (Kontaktliste)

  • Sie enthält eine Avonni-Liste oder Datentabelle, die Kontakte anzeigt.

  • Jeder Kontakt in der Datentabelle enthält eine „Bearbeiten“-Schaltfläche, die Sie als neue Spalte hinzufügen können, indem Sie in den Tabelleneinstellungen den Schaltflächentyp auswählen.

  • Die „Bearbeiten“-Schaltfläche hat eine „Beim Klicken“-Interaktion, die „Dynamische Komponente Dialog öffnen“ verwendet.

Komponente B (Bearbeitungs-Modal):

1

Eingabevariable erstellen

Erstellen Sie eine Textvariable mit dem Namen inputContactId. Machen Sie sie „Für Eingabe verfügbar“. Diese erhält die ID von Komponente A.

Warum? Das inputContactId Die Textvariable erhält die ID des ausgewählten Kontakts aus Komponente A (der Kontaktliste), wenn Komponente B (der Modal-Dialog) geöffnet wird. Das Kennzeichnen als Für Eingabe verfügbar ermöglicht es Komponente A, die Kontakt-ID zu übergeben, die Komponente B verwendet, um den korrekten Kontaktdatensatz zum Bearbeiten abzurufen und anzuzeigen.

2

Datensatzvariable erstellen

Erstellen Sie eine Datensatzvariable mit dem Namen contactToEdit. Setzen Sie ihren Objekt-API-Namen auf Kontakt.

Warum? Das contactToEdit Die Datensatzvariable speichert die Daten des spezifischen Kontaktdatensatzes, der im Modal-Dialog bearbeitet wird. Sie ermöglicht der Komponente, die Kontaktdaten abzurufen, anzuzeigen und zu aktualisieren (z. B. Vorname, E-Mail) basierend auf der von der Kontaktliste übergebenen ID. Dies stellt sicher, dass das Modal mit dem korrekten Datensatz arbeitet.

3

Fügen Sie die Interaktion „Beim Laden“ zu Komponente B hinzu

  • Wählen Sie Komponente B (oberste Ebene).

  • Fügen Sie eine Aktion zum Beim Laden Ereignis hinzu

Warum? Das Beim Laden Die Interaktion wird automatisch ausgeführt, wenn Komponente B (der Modal-Dialog) geladen wird, bevor sie sichtbar wird. Dadurch können Sie den spezifischen Kontaktdatensatz (unter Verwendung der von Komponente A übergebenen ID) abrufen und in der contactToEdit Datensatzvariable speichern. Dies stellt sicher, dass das Modal beim Öffnen mit den korrekten Daten zum Bearbeiten gefüllt ist.

4

Konfigurieren Sie die Aktion „Datensätze abrufen“

  • Aktionstyp: Datensätze abrufen.

  • Datensatzvariable: Wählen Sie {!contactToEdit}.

  • Objekt-API-Name: Kontakt.

  • Datensatz-ID: Binden Sie dies an Ihre Eingabevariable: {!inputContactId}.

Warum? Das Datensätze abrufen Die Aktion ruft die Daten des spezifischen Kontaktdatensatzes ab, wenn Komponente B (der Modal-Dialog) geladen wird. Indem Sie die Datensatzvariable auf contactToEditsetzen, werden die abgerufenen Daten dort zum Bearbeiten gespeichert. Der Objekt-API-Name legt das Kontaktobjekt fest, und das Binden der Datensatz-ID an inputContactId stellt sicher, dass die Aktion den korrekten Kontaktdatensatz basierend auf der von Komponente A (der Kontaktliste) übergebenen ID abruft.

5

Eingabefelder hinzufügen

Mit der konfigurierten Beim Laden Interaktion fügen Sie Eingabefelder zu Komponente B (dem Modal-Dialog) hinzu, um den Kontaktdatensatz zu bearbeiten. Gehen Sie im Component Builder zum Felder Tab im Komponentenmenü, ziehen Sie die gewünschten Felder auf die Leinwand und binden Sie sie an die contactToEdit Datensatzvariable, um die korrekten Kontaktdaten anzuzeigen und zu bearbeiten.

Warum? Eingabefelder ermöglichen es Benutzern, die Kontaktdaten (z. B. Vorname, E-Mail) im Modal anzusehen und zu ändern. Das Binden der Felder an die contactToEdit-Datensatzvariable stellt sicher, dass sie mit den während der Beim Laden Interaktion abgerufenen spezifischen Kontaktdaten gefüllt sind und eine genaue Bearbeitung ermöglichen.

6

Speichern-Schaltfläche hinzufügen

Fügen Sie Komponente B (dem Modal-Dialog) eine Schaltfläche hinzu. Konfigurieren Sie eine Beim Klicken Interaktion mit der Aktualisieren aus Datensatzvariable Aktion, die die {!contactToEdit} Datensatzvariable

Warum? als Ziel verwendet. Aktualisieren aus Datensatzvariable Die Speichern-Schaltfläche ermöglicht es Benutzern, Änderungen an den Kontaktdaten im Modal zu speichern. Die contactToEdit Aktion verwendet die

7

Datensatzvariable, um den Kontaktdatensatz in Salesforce mit den bearbeiteten Feldwerten zu aktualisieren und sicherzustellen, dass Änderungen gespeichert werden.

Interaktion von Komponente A Bearbeiten Um zu ermöglichen, dass die

  • Schaltfläche in der Datentabelle von Komponente A (Kontaktliste) Komponente B (Modal-Dialog) öffnet, gehen Sie wie folgt vor:Wählen Sie die Datentabelle aus

  • : In Komponente A wählen Sie die Datentabelle im Component Builder aus.Gehen Sie zum Interaktionen-Tab Interaktionen : Navigieren Sie zum

  • Tab im Komponentenmenü.Zeilenaktion hinzufügen : UnterZeilenaktionen Bearbeiten , fügen Sie eine neue Aktion für die

  • Schaltfläche (vorher erstellt) hinzu.Interaktionstyp festlegen : Wählen Sie Dynamische Komponente Dialog öffnen

  • als Interaktionstyp.Komponente B auswählen

  • : Wählen Sie Komponente B (den Modal-Dialog) als Zielkomponente zum Öffnen aus.:

    • Eingabevariable konfigurieren

    • Wählen Sie die Variable inputContactId (in Komponente B als Für Eingabe verfügbar gesetzt). Setzen Sie den Wert auf Datensatz: Id

Warum? um die ID des Kontakts aus der ausgewählten Zeile zu übergeben. Bearbeiten Diese Interaktion verknüpft die Beim Laden Schaltfläche in jeder Datentabellenzeile mit Komponente B und übergibt die ausgewählte Kontakt-ID an die Variable inputContactId. Komponente B verwendet diese ID in ihrer

Interaktion, um den richtigen Kontaktdatensatz zum Bearbeiten abzurufen und anzuzeigen und so einen reibungslosen und genauen Bearbeitungsprozess zu gewährleisten.

Ergebnis Wenn der Benutzer in Komponente A auf „Bearbeiten“ klickt, öffnet sich Komponente B. Bevor inputContactId Komponente B angezeigt wird, wird ihre „Beim Laden“-Interaktion ausgelöst, verwendet die übergebene contactToEdit um den vollständigen Kontaktdatensatz mittels „Datensätze abrufen“ zu laden und die contactToEditVariable zu füllen. Die Eingabefelder (gebunden an

) werden dann gerendert, sind bereits mit den korrekten Kontaktdaten gefüllt und bereit zur Bearbeitung.


Implementieren Sie Fehlerbehandlung innerhalb von Flows, wenn diese verwendet werden.

Zusammenfassung bevor Die Interaktion Beim Laden ist Ihr wesentliches Werkzeug zum Vorbereiten von Daten und Initialisieren von Variablen Datensätze abrufen bevor Ihre Dynamic Component gerendert wird. Verwenden Sie Flow ausführen um bestimmte Datensätze abzurufen (insbesondere verwandte Daten oder Daten für Modale/Seitenleisten) und

Zuletzt aktualisiert

War das hilfreich?