iter(g161): 通知支持同 key 原地更新
This commit is contained in:
+7
-1
@@ -872,7 +872,7 @@ const content = h(
|
||||
section(
|
||||
'sec-notification',
|
||||
'通知卡片',
|
||||
'notification:右下角堆叠(与右上角 toast 分区),标题 + 描述 + 操作区,缺省常驻需手动关闭;duration 传毫秒可自动消失,悬停或聚焦会暂停倒计时、离开按剩余时间续计。',
|
||||
'notification:右下角堆叠(与右上角 toast 分区),标题 + 描述 + 操作区,缺省常驻需手动关闭;duration 传毫秒可自动消失,悬停或聚焦会暂停倒计时、离开按剩余时间续计;带 key 的第二次调用原地改同一张卡(进度刷新不再堆条)。',
|
||||
h(
|
||||
'div',
|
||||
{ class: 'row' },
|
||||
@@ -881,6 +881,12 @@ const content = h(
|
||||
button({ label: '警告(常驻)', variant: 'ghost', onClick: () => notification({ title: '连接不稳定', description: '正在重试第 2 次,请检查网络', variant: 'warning' }) }),
|
||||
button({ label: '错误(可关)', variant: 'danger', onClick: () => notification({ title: '保存失败', description: '服务端返回 500,请稍后重试', variant: 'danger' }) }),
|
||||
button({ label: '左上角通知', variant: 'ghost', onClick: () => notification({ title: '后台任务已排队', description: '四个角各自独立堆叠,这条去左上角', placement: 'top-left' }) }),
|
||||
button({ label: '同 key 原地更新', variant: 'ghost', onClick: () => { // 三拍演示:一条卡原地改三次,不会堆成三条
|
||||
const job = notification({ key: 'sync-job', title: '同步中 0%', description: '正在上传附件' });
|
||||
window.setTimeout(() => job.update({ title: '同步中 60%', description: '已上传 3 / 5 个文件' }), 900);
|
||||
window.setTimeout(() => job.update({ title: '同步完成', description: '5 个文件已全部就绪', variant: 'success' }), 1800);
|
||||
window.setTimeout(() => job.close(), 4000);
|
||||
} }),
|
||||
),
|
||||
),
|
||||
section(
|
||||
|
||||
Reference in New Issue
Block a user