Adicione e edite scripts de cliente em Construtor de IU para que você possa atualizar o estado do cliente por meio de eventos. Você pode vincular esses scripts a qualquer componente usando um manipulador de eventos.

Antes de Iniciar

Função necessária: iu_builder_admin

Por Que e Quando Desempenhar Esta Tarefa

Você pode criar client scripts JavaScript em Construtor de IU Usando o editor Now Code. Em seguida, você pode adicionar o client script como um manipulador de eventospara atualizar o estado do cliente, emita um evento tratado da sua página ou execute um recurso de dadosoperação. Por exemplo, você pode escrever um script para incrementar uma data ou contador e vincular o script a um evento de componente, como um clique de botão. Para obter mais informações sobre o Now Code Editor, consulte Editar código com o Now Code Editor (recurso avançado).

Com esses scripts, você pode executar as seguintes ações:

  • Obtenha dados disponíveis, manipule os dados e armazene-os no estado do cliente.
  • Acessar resultados de recursos de dados.
  • Execute operações de recursos de dados.
  • Eventos de expedição.

Procedimento

  1. Navegar até Tudo > Estrutura do Now Experience > Construtor de IU.
  2. Abra uma experiência na qual trabalhar ou crie uma experiência selecionando Criar > Experiência.
  3. Abra ou crie uma página.
    Para obter mais informações sobre como criar uma página no Construtor de IU, consulte Crie uma página no Construtor de IU .
  4. (Opcional) Se você não tiver nenhum componente em sua página, adicione um componente à sua página.
    Por exemplo, você pode adicionar um componente de título. Para obter mais informações, consulte Adicionar e configurar componentes.
  5. Selecione . ao lado de Scripts de cliente .
    Seta apontando para o botão Client scripts na barra lateral.
  6. Nomeie seu script.

    Um nome descritivo ajuda você a saber o que o script faz. Isso também facilita a localização do script mais tarde quando você o adiciona a um manipulador de eventos. O exemplo a seguir mostra um client script de data simples.

  7. Escreva seu script para executar uma ação.
    Por exemplo, você pode escrever um script de data simples que você vincula a um componente. Script de exemplo de um client script.
  8. (Opcional) Adicione um Inclusão de script ou Componentes associados , que aparece em importações parâmetro da sua função de client script.
  9. Selecione o componente em sua página ao qual você deseja vincular o script e selecione Eventos .
  10. Selecione - Adicione um novo manipulador de eventos , selecione o script que você criou em Scripts e selecione Adicionar .

    O exemplo a seguir mostra um client script de data.

    Scripts listados na tela Adicionar manipulador de eventos.
  11. Selecione Save (Salvar).
  12. Para visualizar seu componente com script, selecione Botão Visualizar que abre a variante de página..