Définir des scripts clients et les lier aux composants

Ajoutez et modifiez des scripts clients afin de Générateur d'IU pouvoir mettre à jour l’état du client via des événements. Vous pouvez lier ces scripts à n’importe quel composant à l’aide d’un gestionnaire d’événements.

Avant de commencer

Rôle requis : ui_builder_admin

Pourquoi et quand exécuter cette tâche

Vous pouvez créer des scripts clients JavaScript à Générateur d'IU l’aide de l’éditeur Now Code. Ensuite, vous pouvez ajouter le script client en tant que gestionnaire d’événements pour mettre à jour l’état du client, émettre un événement géré de votre page ou exécuter une opération de ressource de données . Par exemple, vous pouvez écrire un script pour incrémenter une date ou un compteur, et lier le script à un événement de composant, comme un clic sur un bouton. Pour plus d’informations sur Now Code Editor, reportez-vous à la section Modifier le code avec Now Code Editor (fonctionnalité avancée).

Avec ces scripts, vous pouvez effectuer les actions suivantes :

• Obtenez les données disponibles, manipulez-les et stockez-les dans l’état client.
• Accéder aux résultats des ressources de données.
• Exécuter des opérations de ressource de données.
• Répartissez les événements.

Procédure

1. Accédez à la Tout > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience pour y travailler ou créez une expérience en sélectionnant Créer > Expérience.
   Pour plus d'informations, consultez Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU.
3. Ouvrez ou créez une page.
   Pour plus d’informations sur la création d’une page dans Générateur d'IU, consultez Créer une page dans le générateur d’IU.
4. Facultatif : Si vous n’avez aucun composant sur votre page, ajoutez-en un à votre page.
   Par exemple, vous pouvez ajouter un composant En-tête. Pour plus d'informations, consultez Ajouter et configurer des composants.
5. Sélectionnez + en regard de Scripts clients.
   
6. Nommez votre script.

   Un nom descriptif vous aide à savoir ce que fait le script. Il est également plus facile de retrouver le script ultérieurement lorsque vous l’ajoutez à un gestionnaire d’événements. L’exemple suivant montre un script client de date simple.

7. Écrivez votre script pour effectuer une action.
   Par exemple, vous pouvez écrire un script de date simple que vous liez à un composant.
8. Facultatif : Ajouter un include de script ou des composants associés, qui s’affichent dans le paramètre d’importation de votre fonction de script client.
9. Sélectionnez le composant de votre page auquel vous souhaitez lier le script, puis sélectionnez Événements.
10. Sélectionnez +Ajouter un nouveau gestionnaire d’événements, sélectionnez le script que vous avez créé sous Scripts, puis sélectionnez Ajouter.

    L’exemple suivant montre un script client de date.

    
11. Sélectionnez Enregistrer.
12. Pour prévisualiser votre composant scripté, sélectionnez