Clientskripts definieren und an Komponenten binden

  • Freigeben Version: Washingtondc
  • Aktualisiert 1. Februar 2024
  • 1 Minute Lesedauer

    • Fügen Sie Client-Skripts in UI Builder hinzu, und bearbeiten Sie sie, damit Sie den Client-Status über Events aktualisieren können. Sie können diese Skripts mithilfe eines Event Handlers an eine beliebige Komponente binden.

    Vorbereitungen

    Erforderliche Rolle: ui_builder_admin

    Warum und wann dieser Vorgang ausgeführt wird

    Sie können JavaScript-Client-Skripts in UI Builder mit dem Now Code-Editor erstellen. Anschließend können Sie das Client-Skript als Event-Handler hinzufügen, um den Client-Status zu aktualisieren, ein behandeltes Event Ihrer Seite auszugeben oder einen Datenressourcenvorgang auszuführen. Sie können beispielsweise ein Skript schreiben, um ein Datum oder einen Zähler zu erhöhen, und das Skript an ein Komponentenereignis binden, z. B. an einen Schaltflächenklick. Weitere Informationen zum Now-Code-Editor finden Sie unter Code mit dem Now Code-Editor bearbeiten (erweiterte Funktion).

    Mit diesen Skripts können Sie die folgenden Aktionen ausführen:

    • Rufen Sie verfügbare Daten ab, bearbeiten Sie die Daten und speichern Sie sie im Client-Status.
    • Greifen Sie auf Datenressourcenergebnisse zu.
    • Datenressourcenvorgänge ausführen.
    • Versenden von Ereignissen.

    Prozedur

    1. Navigieren zu Alle > Now Experience Framework > UI Builder.
    2. Öffnen Sie eine Experience, um in zu arbeiten, oder erstellen Sie eine Experience, indem Sie + Erstellenauswählen.
      Weitere Informationen finden Sie unter Konfigurieren Sie, wie Benutzer mit Ihren Anwendungen in interagieren UI Builder.
    3. Öffnen oder erstellen Sie eine Seite.
      Weitere Informationen zum Erstellen einer Seite in UI Builderfinden Sie unter Seiten in UI Builder erstellen.
    4. Wahlweise: Wenn Sie keine Komponenten auf Ihrer Seite haben, fügen Sie Ihrer Seite eine Komponente hinzu.
      Sie können beispielsweise eine Überschriftenkomponente hinzufügen. Weitere Informationen finden Sie unter Fügen Sie Komponenten hinzu, und konfigurieren Sie sie.
    5. Wählen Sie + neben Client-Skriptsaus.
      Pfeil, der auf die Schaltfläche „Client-Skripts“ in der Seitenleiste zeigt.
    6. Benennen Sie Ihr Skript.

      Ein beschreibender Name hilft Ihnen zu wissen, was das Skript tut. Es erleichtert auch das spätere Auffinden des Skripts, wenn Sie es einem Event Handler hinzufügen. Das folgende Beispiel zeigt ein einfaches Datums-Client-Skript.

    7. Schreiben Sie Ihr Skript, um eine Aktion auszuführen.
      Sie können beispielsweise ein einfaches Datumsskript schreiben, das Sie an eine Komponente binden. Beispielskript eines Client-Skripts.
    8. Wahlweise: Fügen Sie eine Skripteinbindung oder Zugeordnete Komponenten hinzu, die im Parameter imports Ihrer Client-Skriptfunktion angezeigt werden.
    9. Wählen Sie die Komponente auf Ihrer Seite aus, an die Sie das Skript binden möchten, und wählen Sie dann Eventsaus.
    10. Wählen Sie +Neuen Event-Handler hinzufügen, wählen Sie das von Ihnen erstellte Skript unter Skriptsaus, und wählen Sie Hinzufügen.

      Das folgende Beispiel zeigt ein Datums-Client-Skript.

      Skripts, die im Bildschirm „Ereignishandler hinzufügen“ aufgeführt sind.
    11. Wählen Sie Speichern.
    12. Um eine Vorschau der Skriptkomponente anzuzeigen, wählen Sie die Schaltfläche Vorschau, um die Seitenvariante zu öffnen..