Gerencie ações nas páginas do Construtor de IU

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 9 min. de leitura

    • Saiba como trabalhar com eventos para que você possa adicionar ações a componentes, páginas, recursos de dados e ações declarativas em Construtor de IU.

    Ações em Construtor de IU

    As ações de IU informam Construtor de IUo que fazer quando um eventoé acionado. Um evento é uma ação que um usuário executa ou uma ocorrência que acontece em um página. Use ações de IU para criar interfaces interativas e fáceis de usar que ajudam os usuários a concluir tarefas. Cada componentetem seus próprios eventos associados a ele. Os eventos incluem:

    • O usuário clica em uma visualização de dados
    • A página busca dados com sucesso
    • O usuário seleciona um botão de opção
    • A página é carregada

    Tipos de eventos que podem acionar ações.

    Eventos em Construtor de IU

    Use um evento para adicionar ações a seus componentes, páginas e recursos de dados.

    • Um evento de componente é uma ação que você configura para um componente. Você configura um manipulador de eventos para configurar essa ação de componente. Por exemplo, você pode adicionar um componente de botão ao seu Construtor de IUpágina. Em seguida, você pode adicionar um manipulador de eventos para aplicar uma ação para esse botão, como ir para uma página da web.
    • Os eventos de página executam ações para a página inteira. Você pode configurar os seguintes eventos de página:
      • Mapeamentos de eventos de página. Adicione, remova ou limpe notificações de alerta na sua página.
      • Mapeamentos de evento de variante. Adicione, remova ou limpe notificações de alerta na variante da sua página.
      • Eventos expedidos. Crie eventos expedidos para sua página para criar mapeamentos de eventos retransmitidos que modelam eventos após um manipulador de eventos primário. Selecione um manipulador de evento primário de destino para modelar os campos de carga após ele.
      • Eventos manipulados. Um evento tratado é um evento exposto e disponível para uso por outros usuários. Depois de criar um evento tratado, ele estará disponível em Page event mappingspara outros usuários usarem. Você também pode configurar campos de carga que você cria manualmente ou escolher um modelo para seu evento tratado, como abrir ou fechar uma caixa de diálogo modal.
    • Os eventos de recursos de dados mapeiam recursos de dados para notificar informações sobre quando os dados são obtidos.
    • Os eventos de uma página ou componente não fazem nada até que o evento seja mapeado para um ou mais manipuladores de eventos.

    Progressão de evento para diferentes tipos de eventos.

    Mapeamento de evento em Construtor de IU

    Mapeie ações para eventos, como clicar em um botão ou preencher um campo. Um mapeamento de evento é o processo que permite mapear a carga de um evento ou valores contextuais para o objeto ou manipulador que atua nesse evento.

    Para obter mais informações sobre mapeamento de eventos, consulte Definir eventos de mapa.

    Manipuladores de eventos em Construtor de IU

    Um manipulador de eventos é uma ação realizada quando ocorre um evento. Ao mapear um manipulador de eventos para um evento, você está especificando qual ação ou ações executar quando o evento ocorrer. Use um manipulador de eventos para configurar uma ação para o. Construtor de IUou os componentes na página. Por exemplo:
    • Clicar em uma visualização de dados abre uma lista de registros representados na visualização
    • A busca bem-sucedida de dados para uma lista abre um alerta que indica que a busca de dados foi bem-sucedida
    • Selecionar um botão de opção ajusta o filtro de uma lista na página
    • Antes de prosseguir, o carregamento de uma página abre um modal para confirmar a aceitação de cookies

    Quando você adiciona um manipulador de eventos a um Construtor de IUou componente, você pode escolher diferentes tipos de manipuladores de eventos. Por exemplo, um componente de botão pode ter os seguintes tipos de manipuladores de eventos:

    • Manipuladores de eventos herdados. Um manipulador de eventos herdado é exposto da página em que você está trabalhando. Se você estiver no primário Construtor de IUum manipulador de eventos herdado pode ser exposto do shell da aplicação. A tabela a seguir lista os diferentes tipos de manipuladores de eventos herdados que você pode usar e o que você pode fazer com eles.
      Tabela 1. Manipuladores de eventos herdados
      Manipulador de eventos Descrição
      URL da trilha alterada
      Link para o destino Navegue até um destino.
      • Rotas de app: Link para outra página em um app, como uma tela inicial.
      • URL externa: Link para um site ou qualquer URL externa.
      Script de amostra
          return {
        route: null, /* Page route, e.g. 'record' */
        fields: null, /* Required params, e.g. {"table":"incident","sysId":"X"} */
        params: null, /* Optional params, e.g. {"selectedIndex" : 1} */
        ☑️redirect: null, /* ??? True/false? */
        ☑️passiveNavigation: null, /* Load in background, e.g. 'false' */
        title: null, 
        multiInstField: null, 
        ☑️targetRoute: null, /* ??? */
        ☑️external: null /* ??? True/false? */
    };
      Adicionar parâmetros à URL Adicione parâmetros adicionais a um URL.
      Script de amostra
      { “selectedTabIndex” : 0 }
      Abrir ou fechar caixa de diálogo modal Depois de criar um modal, use Open or close modal dialogpara acionar o modal.
    • Manipuladores de eventos no nível da página. Esse tipo de manipulador de eventos é comum a todas as páginas, e você usaria esse tipo de manipulador quando quiser adicionar ou limpar notificações de alerta no nível da página. A tabela a seguir lista os diferentes tipos de manipuladores de eventos no nível de página que você pode usar e o que você pode fazer com eles.
      Tabela 2. Manipuladores de eventos no nível da página
      Manipulador de eventos Descrição
      Adicionar notificações de alerta Adicione um snippet de código para enviar uma notificação de alerta. Por exemplo: 
      return {
    items: [{"type" : "info", "message" : "Info message", "id" : "optionalID"}] /* Types: info, warning, error */
};
      Remover notificação de alerta Adicione o código para chamar os IDs de notificação de alerta que você deseja ignorar. Por exemplo, clique em um botão para remover uma notificação de alerta de carregamento de página.
      Limpar notificação de alerta Adicione código para chamar todos os IDs de notificação de alerta que você deseja ignorar. Por exemplo, clique em um botão para remover todas as notificações de alerta.
      Definir estado de carregamento Ativar ou desativar o carregamento. Por exemplo, você pode ativar o carregamento para carregar a página quando clica em um botão ou desativar o carregamento para não carregar a página quando um botão é clicado.
      Atualizar parâmetro de estado do cliente Defina declarativamente o parâmetro de estado do cliente. Digamos que você tenha um parâmetro de estado do cliente configurado com um valor. Você pode configurar o. Update client state parametermanipulador de eventos para atualizar o parâmetro de estado do cliente com um novo valor. Por exemplo, você tem um parâmetro de estado do cliente que é chamado Saudação que está configurado com Olá como o valor inicial. Você pode adicionar um Update client state parametermanipulador de eventos, selecione Saudação parâmetro de estado do cliente e insira um novo valor como Adeus . Ao clicar no botão, Adeus substitui Olá na página.
      Carga da janela de visualização do macroponent UXF solicitada Adicione a um componente, como um componente de botão, para abrir uma janela de visualização. Para obter mais informações, consulte Adicione um componente da janela de visualização à sua página.
    • Manipuladores de recursos de dados. Este tipo de manipulador de eventos aciona a busca ou gravação de dados no servidor.
      Você pode atualizar os dados da fonte de dados do shell do app em seu Construtor de IUclicando em um botão. Por exemplo, com um manipulador de recursos de dados, você pode executar as seguintes ações:
      • Vincule dados à descrição de um registro de incidente.
      • Altere o valor da descrição do incidente.
      • Adicione um componente de botão à sua página.
      • Rotule o botão como Atualizar incidente .
      • Adicione um Look Up Recordmanipulador de eventos para o botão.
      • Salve sua página.
      • Se a descrição do registro de incidente mudar, clique em Atualizar para atualizar a descrição em sua página.
    • Scripts do cliente. Scripts que são executados quando um evento é acionado em um componente. Você cria esses scripts na seção Scripts de cliente em Construtor de IU. Para obter mais informações, consulte Como definir e vincular client scripts aos componentes.

    Vinculando eventos a componentes em Construtor de IU

    Vincule manipuladores de eventos aos eventos em um componente. Quando você adiciona componentes ao Construtor de IU, esses componentes não estão configurados para executar nenhuma ação em sua página. Por exemplo, um componente de botão é estático e não faz nada até que você vincule uma ação de evento a ele, como excluir um registro. Alguns componentes têm vários eventos em que manipuladores de eventos podem ser atribuídos. Por exemplo, no componente de lista, você pode atribuir um manipulador de navegação ao Row clickedevento. Você também pode atribuir um modal aberto ao Data fetch failedevento. Para obter mais informações, consulte Vincular um evento a um componente.

    Vinculando eventos a páginas do Construtor de IU

    Vincule um evento no nível da página para executar manipuladores de eventos na página. Por exemplo, use eventos no nível de página para notificações de página, carregamento de página ou quando uma propriedade de página mudar. A atribuição do manipulador de eventos ao evento no nível da página é semelhante à atribuição de manipuladores a eventos de componentes.

    Você pode vincular mapeamentos de eventos usando os seguintes métodos:
    • Mapeamentos de eventos de página. Adicione, remova ou limpe notificações de alerta na sua página.
    • Mapeamentos de evento de variante. Adicione, remova ou limpe notificações de alerta na variante da sua página.
    • Eventos expedidos. Crie eventos expedidos para sua página para criar mapeamentos de eventos retransmitidos que modelam eventos após um manipulador de eventos primário. Selecione um manipulador de evento primário de destino para modelar os campos de carga após ele.
    • Eventos manipulados. Adicione um evento tratado para um evento exposto e disponível para uso por outros usuários.
    Para obter mais informações, consulte Vincule um evento a uma página.

    Vinculando eventos a recursos de dados em Construtor de IU

    Vincule manipuladores de eventos a recursos de dados individuais no Construtor de IUpágina. Por exemplo, quando um recurso de dados busca novos dados com sucesso, ele executa um manipulador de eventos, como navegação, para levar um usuário para a próxima etapa em um fluxo. Quando um recurso de dados adiciona com sucesso um registro a uma tabela, ele mostra um modal de sucesso que usa o manipulador de eventos do modal de mostrar. Para obter mais informações, consulte Vincule um evento a um recurso de dados.

    Vinculando eventos a ações declarativas em Construtor de IU

    Vincule elementos de dados para adicionar ações de evento a uma definição de ação declarativa em Ações e componentes em ServiceNow AI Platform®. Por exemplo, você pode vincular um elemento de dados para adicionar uma ação de evento para concluir o trabalho em uma tabela.

    Se você adicionar um componente ao Construtor de IUpágina que tem uma ação declarativa, você deve vinculá-la a um evento tratado. O evento tratado cria uma ação que é executada quando um usuário seleciona o componente. Selecionando Configure o mapeamento de evento de ação declarativa , você adiciona um novo manipulador de eventos para definir o que a ação declarativa faz na página.

    Configure a opção Mapeamentos de evento de ação declarativa no painel Configurar.

    Para obter mais informações, consulte Vincular um evento a uma ação declarativa.