Reaktive Komponenten

Überblick

Reaktive Komponenten sind dafür ausgelegt, dynamisch auf Änderungen von Daten oder Benutzerinteraktionen innerhalb Ihrer Experience Site zu reagieren. Wenn sich eine Komponente aktualisiert – beispielsweise wenn ein Benutzer einen Eintrag auswählt – aktualisieren sich verwandte Komponenten automatisch, um diese Änderungen widerzuspiegeln, und schaffen so ein flüssiges und ansprechendes Erlebnis für Ihre Besucher.

Vorteile für Ihre Site

Die Integration dieser reaktiven Komponenten in Ihre Experience Site eröffnet neue Möglichkeiten für dynamische und interaktive Designs. Sie ermöglichen es Ihrer Site, in Echtzeit auf Benutzeraktionen zu reagieren und relevante Informationen bereitzustellen, ohne manuelle Aktualisierungen oder zusätzliche Navigation zu erfordern, und verbessern so die Gesamtnutzbarkeit.

Praktische Anwendungsfälle

Dynamische Kontodetails mit Karten

Konfigurieren Sie eine Avonni-Karte, um Kontostandorte anzuzeigen. Wenn ein Benutzer einen Standort auswählt, erscheinen verwandte Kontodetails (z. B. Name, Beschreibung, Branche) automatisch in einem Avonni-Textblock und bieten eine intuitive Möglichkeit, Daten zu erkunden.

Vernetzte Datentabellen

Richten Sie eine Avonni-Datentabelle ein, um Konten aufzulisten. Die Auswahl eines Kontos löst eine Aktualisierung einer zweiten Datentabelle aus, die die zugehörigen Kontakte anzeigt und nahtlose Navigation durch große Datensätze ermöglicht.

Warum reaktive Komponenten wichtig sind

Reaktive Komponenten ermöglichen es Ihrer Experience Site, über Elemente hinweg zu reagieren und zu kommunizieren, wodurch sie dynamischer und benutzerfreundlicher wird. Diese Interaktivität hilft Besuchern, Informationen effizient zu finden und zu nutzen, was zu einem ansprechenderen und produktiveren Erlebnis führt.

Einrichtung Ihrer reaktiven Avonni-Komponenten

Integrieren Sie diese reaktiven Komponenten mit einem einfachen Einrichtungsprozess in Ihre Experience Site, um die Interaktivität zu verbessern:

Was macht eine Komponente „reaktiv"?

Eine Komponente wird reaktiv, indem ihre Daten mit anderen Komponenten verknüpft werden, sodass automatische Aktualisierungen basierend auf Benutzeraktionen erfolgen. Dies wird mit zwei einfachen Schritten erreicht

Schritte zur Aktivierung der Reaktivität

1

Benennen Sie Ihre Datenkomponenten (componentApiName)

  • Weisen Sie jeder Komponente im Eigenschaftenbereich einen eindeutigen Spitznamen zu. Nennen Sie zum Beispiel eine Datentabelle, die Konten auflistet, accountsDatatable.

  • Warum das? Der Spitzname identifiziert die Komponente für die Reaktivität und ermöglicht anderen Komponenten, auf ihre Daten zu verweisen

2

Sagen Sie anderen Komponenten, wie sie reagieren sollen

  • Geben Sie an, welche Komponenten sich aktualisieren sollen, wenn ein Benutzer mit einer anderen interagiert. Verwenden Sie die folgende Syntax in den Eigenschaften der Zielkomponente:text{{componentApiName.selectedRecord.componentFieldApiName}}

  • Aufschlüsselung:

    • componentApiName: Der von Ihnen vergebene Spitzname (z. B. accountsDatatable).

    • selectedRecord: Die Zeile oder das Element, das der Benutzer auswählt.

    • componentFieldApiName: Das spezifische Feld, das angezeigt werden soll (z. B. Name, Branche).

  • Warum das? Diese Syntax verknüpft die ausgewählten Daten (z. B. ein Konto- Name) mit einer anderen Komponente und löst eine automatische Aktualisierung aus

Fehlerbehebung bei häufigen Problemen

  • Komponenten aktualisieren sich nicht: Stellen Sie sicher, dass jede Komponente einen eindeutigen componentApiName hat und dass die Syntax ({{componentApiName.selectedRecord.componentFieldApiName}}) korrekt in den Eigenschaften der Zielkomponente eingegeben ist.

  • Keine Daten angezeigt: Überprüfen Sie, ob die Quellkomponente (z. B. accountsDatatable) Daten enthält und dass das componentFieldApiName mit einem verfügbaren Feld übereinstimmt (z. B. Name).

  • Reaktivitätsverzögerung: Prüfen Sie auf komplexe Datensätze; vereinfachen Sie Abfragen oder reduzieren Sie die Anzahl der reaktiven Verknüpfungen, um die Leistung zu verbessern.

  • Wenn Probleme weiterhin bestehen: Kontaktieren Sie unser Support-Team unter [email protected] für Unterstützung.

Geführte Beispiele

Cover

Erfahren Sie, wie Sie eine Avonni-Datentabelle und eine Karte in einer Experience Site verbinden, um Standorte dynamisch basierend auf benutzergewählten Konten anzuzeigen.

Cover

Erfahren Sie, wie Sie eine Avonni-Datentabelle für Konten mit einer Kontaktetabelle verknüpfen, sodass die Kontaktetabelle dynamisch aktualisiert wird und nur Kontakte für das ausgewählte Konto anzeigt

Zuletzt aktualisiert

War das hilfreich?