错误、重试与中断
Error / Retry / Stop
说明哪一步失败、哪些结果保留，以及用户可以如何恢复。
请求没有完成
连接已中断，之前的内容仍然保留。
app.mjs
import { mount } from '@sofish/ui/browser';
const view = mount(
document.querySelector('#example'),
'error',
{
"demo": true
}
);
view.element.addEventListener('ui:retry', event => {
console.log(event.detail.value);
});
// view.update({ ...nextProps });
// view.destroy();什么时候用
网络、模型或工具失败，或用户主动停止任务。
什么时候不用
失败原因未知时不要把所有错误都标成网络异常。
COMPONENT API
属性与事件
传入业务数据，通过事件连接你的应用。
| 属性 | 默认值 |
|---|---|
title | "请求没有完成" |
description | "连接已中断，之前的内容仍然保留。" |
retryLabel | "重试演示" |
retry | null |
demo | false |
事件
ui:retry ui:error
INTERACTION NOTES
交互与可访问性
- 错误说明与恢复按钮相邻。
- 错误出现时不无条件抢焦点。
和相似组件的区别
停止生成不等于撤销已完成的外部动作；重试也可能产生新一次执行。
RESEARCH & ALTERNATIVES
官方实现映射
以下是上游生态对同类交互的实现。上方运行的是 UI 自己的组件。
关键状态
React / Next.js · 来源核验