任务进度
Progress / Progress Bar
表达任务已完成多少，或说明正在推进。
app.mjs
import { mount } from '@sofish/ui/browser';
const view = mount(
document.querySelector('#example'),
'progress'
);
// view.update({ ...nextProps });
// view.destroy();什么时候用
上传、导出或可测量的长任务。
什么时候不用
没有真实总量时不要显示虚构百分比。
COMPONENT API
属性与事件
传入业务数据，通过事件连接你的应用。
| 属性 | 默认值 |
|---|---|
label | "示例导入进度" |
value | 64 |
max | 100 |
事件
展示组件；通过 update(props) 更新内容。
INTERACTION NOTES
交互与可访问性
- 提供名称和真实数值。
- 完成、停止或失败都用文字表达，不只变化颜色。
和相似组件的区别
Progress 描述推进程度；Streaming 描述内容逐步到达的生成状态。
RESEARCH & ALTERNATIVES
官方实现映射
以下是上游生态对同类交互的实现。上方运行的是 UI 自己的组件。
关键状态
Vue / Nuxt · 来源核验