iter(g112): 消息提示支持撤销类操作
This commit is contained in:
@@ -29,8 +29,11 @@ export function showToast(props: ToastProps): HTMLElement {
|
||||
let startedAt = 0; // 本段计时起点,用于折算剩余
|
||||
const item = h(
|
||||
'div',
|
||||
{ class: `ua-toast ua-toast-${props.variant ?? 'info'}${props.closable ? ' is-closable' : ''}`, role: 'status', id: `ua-toast-${++seq}` },
|
||||
{ class: `ua-toast ua-toast-${props.variant ?? 'info'}${props.closable ? ' is-closable' : ''}${props.actionLabel ? ' is-action' : ''}`, role: 'status', id: `ua-toast-${++seq}` },
|
||||
h('span', { class: 'ua-toast-msg' }, props.message),
|
||||
props.actionLabel
|
||||
? h('button', { type: 'button', class: 'ua-toast-action', onClick: () => { dismiss(item); props.onAction?.(); } }, props.actionLabel) // 操作按钮(如撤销):点完立即收起再回调
|
||||
: null,
|
||||
props.closable ? h('button', { type: 'button', class: 'ua-toast-close', 'aria-label': '关闭提示', onClick: () => dismiss(item) }, '×') : null,
|
||||
);
|
||||
const stack = ensureHost();
|
||||
|
||||
@@ -311,6 +311,8 @@ export interface ToastProps {
|
||||
duration?: number; // 自动消失毫秒;缺省 3000
|
||||
closable?: boolean; // 是否显示关闭按钮(手动立即收起);缺省 false
|
||||
variant?: 'info' | 'success' | 'warning' | 'danger'; // 语义色;缺省 info
|
||||
actionLabel?: string; // 操作按钮文案(如「撤销」);传了才渲染,点后立即收起
|
||||
onAction?: () => void; // 操作按钮回调(在收起之后触发)
|
||||
}
|
||||
|
||||
/*** 加载指示器入参 ***/
|
||||
|
||||
Reference in New Issue
Block a user