Aviso de tradução por IA

Este documento foi traduzido por IA. Para informações precisas, consulte a versão em inglês.

ctx.notification

Baseada na API de notificação do Ant Design, esta API global de notificação é usada para exibir painéis de notificação no canto superior direito da página. Comparada ao ctx.message, as notificações podem incluir um título e uma descrição, tornando-as adequadas para conteúdos que precisam ser exibidos por um período mais longo ou que exigem a atenção do usuário.

Cenários de Uso

CenárioDescrição
JSBlock / Eventos de AçãoNotificações de conclusão de tarefa, resultados de operações em lote, conclusão de exportação, etc.
Fluxo de Trabalho (FlowEngine)Alertas de nível de sistema após o término de processos assíncronos.
Conteúdo que requer exibição prolongadaNotificações completas com títulos, descrições e botões de ação.

Definição de Tipo

notification: NotificationInstance;

NotificationInstance é a interface de notificação do Ant Design, que fornece os seguintes métodos.

Métodos Comuns

MétodoDescrição
open(config)Abre uma notificação com configuração personalizada
success(config)Exibe uma notificação do tipo sucesso
info(config)Exibe uma notificação do tipo informação
warning(config)Exibe uma notificação do tipo aviso
error(config)Exibe uma notificação do tipo erro
destroy(key?)Fecha a notificação com a chave (key) especificada; se nenhuma chave for fornecida, fecha todas as notificações

Parâmetros de Configuração (Consistentes com o Ant Design notification):

ParâmetroTipoDescrição
messageReactNodeTítulo da notificação
descriptionReactNodeDescrição da notificação
durationnumberAtraso para fechamento automático (segundos). O padrão é 4,5 segundos; defina como 0 para desativar o fechamento automático
keystringIdentificador único da notificação, usado em destroy(key) para fechar uma notificação específica
onClose() => voidFunção de retorno (callback) acionada quando a notificação é fechada
placementstringPosição: topLeft | topRight | bottomLeft | bottomRight

Exemplos

Uso Básico

ctx.notification.open({
  message: 'Operação bem-sucedida',
  description: 'Os dados foram salvos no servidor.',
});

Chamadas Rápidas por Tipo

ctx.notification.success({
  message: ctx.t('Export completed'),
  description: ctx.t('Exported {{count}} records', { count: 10 }),
});

ctx.notification.error({
  message: ctx.t('Export failed'),
  description: ctx.t('Please check the console for details'),
});

ctx.notification.warning({
  message: ctx.t('Warning'),
  description: ctx.t('Some data may be incomplete'),
});

Duração e Chave Personalizadas

ctx.notification.open({
  key: 'task-123',
  message: ctx.t('Task in progress'),
  description: ctx.t('Please wait...'),
  duration: 0,  // Não fecha automaticamente
});

// Fechar manualmente após a conclusão da tarefa
ctx.notification.destroy('task-123');

Fechar Todas as Notificações

ctx.notification.destroy();

Diferença em relação ao ctx.message

Característicactx.messagectx.notification
PosiçãoCentro superior da páginaCanto superior direito (configurável)
EstruturaDica leve de linha únicaInclui título + descrição
ObjetivoFeedback temporário, desaparece automaticamenteNotificação completa, pode ser exibida por um longo tempo
Cenários TípicosSucesso da operação, falha de validação, sucesso de cópiaConclusão de tarefa, mensagens do sistema, conteúdo longo que requer atenção

Relacionados

  • ctx.message - Dica leve no topo, adequada para feedback rápido
  • ctx.modal - Confirmação em modal, interação bloqueante
  • ctx.t() - Internacionalização, frequentemente usada em conjunto com notificações