UniApp 组件 · 实验
UGSpinner 加载指示器
用于局部加载和异步等待的旋转指示器。
组件预览
以下画面来自同一组件源码的 H5 构建,用于检查内容、状态和主题;MP-WEIXIN 最终外观仍以开发者工具和真机为准。
使用方式
配置 easycom 后直接使用 <ug-spinner>,无需在页面脚本中导入组件。
vue
<template><ug-spinner label="正在同步数据" show-label tone="primary" /></template>
easycom 公开入口:@ug666/ui-uniapp/components/ug-spinner/ug-spinner.vue
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| size | 'sm' | 'md' | 'lg' | 'md' | 加载指示器尺寸。 |
| tone | 'neutral' | 'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 加载指示器语义色调。 |
| label | string | '加载中' | 加载状态的可访问名称。 |
| showLabel | boolean | false | 在图标旁显示 label 文本。 |
事件
当前组件没有公开事件。
注意事项
- label 始终作为可访问名称,只有 showLabel 为 true 时才显示可见文字。
- 可量化任务应优先使用 Progress。
- 当前只验证 MP-WEIXIN 编译,动画流畅度仍需开发者工具和真机检查。
平台边界
总览中的画面来自同一组件源码的 H5 构建,只用于辅助浏览;小程序真实外观仍以 Demo 在微信开发者工具和真机中的结果为准。
MP-WEIXIN 已编译
开发者工具与真机待验证