组件函数

组件函数（Component Functions）允许您在 JS 逻辑（如 setup、异步回调、工具函数）中直接唤起 TechUI 的交互组件，而无需在模板中显式挂载组件标签。

请跳转查看完整文档

全局功能函数完整文档，请点击查阅 全局服务-函数 章节

在各个组件内部也有相关的提及和介绍：

如 通知组件-消息 章节

如 基础支撑-加载 章节

调用方式

所有组件函数均挂载在全局对象 $global 上，推荐使用 inject 进行解构获取。

import { inject } from 'vue';

// 在 setup 中注入
const { 
  $tMessage, 
  $tLoading, 
  $tLoadingClose 
} = inject("$global");

const handleAction = async () => {
  $tLoading('Processing...');
  try {
    // 业务逻辑...
    $tMessage({ type: 'success', content: 'Done!' });
  } finally {
    $tLoadingClose();
  }
};

消息反馈

用于即时告知用户操作结果或状态。

Message 全局消息

最常用的状态反馈，通常位于顶部居中。

• $tMessage(options): 显示消息。options 可为字符串或对象 { type: 'success'|'error', content: '...' }。
• $tMessageCloseAll(): 关闭所有当前显示的消息。

Notify 通知提醒

带有标题和详情的通知，通常位于屏幕右上角。

• $tNotify(options): 显示通知。支持 { title, content, type } 配置。
• $tNotifyCloseAll(): 关闭所有通知。

Toast 轻提示

极简的文本提示，干扰性最小，通常位于屏幕中央或底部。

• $tToast(options): 显示 Toast。options 可为字符串或对象。
• $tToastClose(): 关闭当前 Toast。

Flash 闪烁警报

在屏幕边缘或全屏产生闪烁光效，用于模拟系统受损、高能反应或紧急警报。

• $tFlash(options): 开启闪烁。支持设置频率 frequency 和样式 appearance。
• $tFlashClose(): 停止闪烁。

Attention Dispatcher 调度器

用于对多个提醒组件进行排序和按序弹出，常用于游戏化指引或连续的任务目标提示。

• $tAttentionDispatcher(config): 初始化调度器并传入任务队列 queue。
• $tAttentionDispatcherClose(): 关闭调度器及当前展示的提醒。

遮罩与加载

用于控制全屏视图状态。

Mask 全局遮罩

覆盖整个页面的半透明层，可用于聚焦模式或阻断用户操作。

• $tMask(options): 显示遮罩。支持配置 blur (背景模糊) 和 closable (点击关闭)。
• $tMaskClose(): 关闭遮罩。

Loading 加载动画

在遮罩基础上增加全息扫描或数据流转动画。

• $tLoading(options): 显示加载。支持 full (全屏) 或 area (局部) 模式，可指定 spinner 类型。
• $tLoadingClose(): 关闭加载动画。

动态浮层

用于在任意位置动态创建浮动元素。

Popover 气泡浮层

手动创建一个 Poptip 或 Popinfo 实例，常用于 Canvas 绘图、图表交互或无法绑定 DOM 的场景。

• $tPopover(target, options): 在指定目标（DOM 元素或选择器）上显示气泡。支持 placement 和 trigger 配置。
• $tPopoverCloseAll(): 关闭所有由 JS 动态创建的气泡实例（不会影响指令或组件创建的实例）。