Aktualisieren Sie den Status einer Komponente mithilfe von Client-Statusparametern

Erstellen und binden Sie einen Client-Statusparameterwert an eine Komponente in UI Builder. Durch Hinzufügen anwenderdefinierter Werte zu Ihren Komponenten können diese Komponenten dann automatisch über ein Skript aktualisiert werden.

Vorbereitungen

Erforderliche Rolle: ui_Builder_admin

Warum und wann dieser Vorgang ausgeführt wird

Sie können einer Seite zwei Komponenten hinzufügen und sie dann verbinden, indem Sie verwenden Client-StatusparameterUnd Skripts. Erstellen Sie zunächst einen Client-Statusparameter, und binden Sie dann den Client-Statusparameter an eine der Komponenten, z. B. eine Bezeichnung. Als Nächstes erstellen Sie ein Client-Skript und binden es mit einem Ereignis-Handler an eine zweite Komponente, z. B. eine Schaltfläche. Wenn Sie den Ereignis-Handler erstellen, binden Sie den Wert des Client-Statusparameters daran, um die beiden Komponenten zu verbinden. Wenn Sie auf eine Komponente klicken, ändert sich der Status der anderen Komponente. Client-status sind nützlich, da Sie Ihren Komponenten anwenderdefinierte Werte hinzufügen können, die automatisch über ein Skript aktualisiert werden können. Betrachten Sie einen Clientstatus als Bucket zum Speichern von Informationen, die für die Seite spezifisch sind.

Sie können Ihrer Seite beispielsweise eine Schaltfläche und eine Bezeichnungskomponente hinzufügen. Die Schaltfläche ändert den Wert der Bezeichnung, z. B. das Ändern der Textfarbe.

Prozedur

1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
2. Öffnen Sie eine Experience, in der Sie arbeiten können, oder erstellen Sie eine Experience, indem Sie auswählen Erstellen > Experience.
   Siehe Konfigurieren Sie, wie Anwender mit Ihren Anwendungen in interagieren UI BuilderWeitere Informationen zum Erstellen von Experiences.
3. Erstellen oder öffnen Sie eine Seite.
   Weitere Informationen finden Sie unter Verwalten UI BuilderSeiten und Seitenvarianten.
4. Fügen Sie Ihrer Seite zwei Komponenten hinzu.
   Weitere Informationen finden Sie unter Komponenten hinzufügen und konfigurieren.
5. Um einen Clientstatusparameter mit einem zugeordneten Wert zu definieren, wählen Sie im unteren linken Bereich Clientstatusparameter aus.
   
6. Wählen Sie Aus + Hinzufügen .
   
7. Geben Sie einen Namen für den Client-Statusnamen, den Typ und den Anfangswert ein.

   Der Clientstatus unterstützt Zeichenfolgen, Zahlen, boolesche Werte und JSON. Sie können beispielsweise den Namen als eingeben Dynamic_label_value , Der Typ als Zeichenfolge , Und der Anfangswert als Anfangswert .

   
8. Binden Sie den Wert des Client-Statusparameters an Ihre Komponente.
   1. Wählen Sie die Komponente aus, an die Sie den Client-Statusparameter binden möchten.
   2. Öffnen Sie den Konfigurationsbereich, und wählen Sie aus Konfigurieren Registerkarte.
   3. Zeigen Sie auf das Feld, an das Sie Daten binden möchten, und wählen Sie das Symbol für die dynamische Datenbindung aus ( ).
      
      Das modale Element „Datenbindung“ wird angezeigt.

      

   4. Wählen Sie Aus clientstatus In Datentypen Registerkarte.
   5. Doppelklicken Sie auf das Client-Skript, das Sie an die Komponente binden möchten.
      
   6. Wählen Sie Übernehmen.
      
9. Wählen Sie Speichern.
10. Binden Sie den Client-Statuswert an eine Komponente, und erstellen Sie ein Skript, um die zweite Komponente mit der ersten zu verbinden.
    1. Wählen Sie im linken Bereich aus + Symbol neben Client-Skripts .
       
    2. Geben Sie einen Skriptnamen ein, der die Aufgabe beschreibt.
       Sie könnten beispielsweise eingeben Aktualisieren Sie Den Bezeichnungswert Denn das soll das Skript tun.
    3. Fügen Sie im Now-Codeeditor Ihr Skript hinzu.

       Nehmen wir an, Sie wählen eine aufzurufende API und die Parameter für die API aus, z. B. einen Status und einen Wert. Sie können beispielsweise anrufen api.setState , Und schließen Sie ein Dynamic_label_value Als erster Parameter und ein NEUER WERT Als zweiter Parameter.

       
11. Fügen Sie Ihrer zweiten Komponente einen Ereignis-Handler hinzu, um das neu erstellte Clientskript aufzurufen.
    1. Wählen Sie die Komponente auf Ihrer Seite aus, an die Sie das Skript binden möchten.
    2. Wählen Sie die Registerkarte Events aus.
    3. Wählen Sie Aus + Fügen Sie einen neuen Ereignis-Handler hinzu .
    4. Wählen Sie im Abschnitt „Skripts“ von Ereignis-Handlern das von Ihnen erstellte Skript aus, und wählen Sie aus + Um es als Ereignis-Handler für die Komponente hinzuzufügen.
       
12. Wählen Sie Speichern.
13. Wählen Sie aus, um eine Vorschau Ihrer Seite anzuzeigen und die Komponenten zu testen, um sicherzustellen, dass sie verbunden sind Vorschau .
    Wenn Sie eine Komponente auswählen, sollte sich der Status der zweiten Komponente ändern. Wählen Sie beispielsweise aus Schaltfläche Komponente, um zu ändern Bezeichnungswert Komponententext von Anfangswert Bis NEUER WERT .

Ergebnisse

Was Sie in diesem Verfahren getan haben:

• Hat Ihrer Seite zwei Komponenten hinzugefügt.
• Definiert einen Client-Statusparameter mit einem Anfangswert.
• Binden Sie den Client-Statusparameter an die erste Komponente.
• Hat ein Client-Skript erstellt, das einen Wert aktualisiert, der durch den Client-Statusparameter definiert ist.
• Hat einen Ereignis-Handler für die zweite Komponente erstellt, um das neue Clientskript aufzurufen, das Sie gerade erstellt haben
• Die zweite Komponente wurde ausgewählt, sodass der Status der ersten Komponente geändert wurde.