跳到正文

Popconfirm 弹出确认

Popconfirm 在触发操作的控件旁边就地询问确认,不用弹出对话框。它是点击触发的 Popover,带一个问题和取消 / 确认两个按钮。

演示

基础用法

打开时焦点落在「取消」上(更安全的选项),按 Esc 或点外面等于取消,关闭后焦点回到触发元素。

异步确认和阻止关闭

onPositiveClick 返回 Promise 时,确认按钮会显示加载,直到它结束。返回 false(或 resolve 成 false 的 Promise)则不关闭。

按钮、图标和自定义操作

positiveText={null} 或 negativeText={null} 隐藏对应按钮,showIcon={false} 隐藏图标,action 替换两个按钮。

Props

名称类型默认值说明版本
contentReactNodeundefined要确认的问题。未发布
positiveTextReactNode | null语言包里的「确认」确认按钮文字;null 表示不显示。未发布
negativeTextReactNode | null语言包里的「取消」取消按钮文字;null 表示不显示。未发布
positiveButtonPropsPartial<ButtonProps>undefined确认按钮的额外属性,比如危险操作用 type: "error"。未发布
negativeButtonPropsPartial<ButtonProps>undefined取消按钮的额外属性。未发布
showIconbooleantrue是否显示警告图标。未发布
iconReactNodeundefined替换警告图标。未发布
actionReactNodeundefined替换两个按钮。未发布
onPositiveClick(event: MouseEvent) => boolean | void | Promise<boolean | void>undefined点确认时调用。返回 false 不关闭;返回 Promise 时显示加载。未发布
onNegativeClick(event: MouseEvent) => boolean | void | Promise<boolean | void>undefined点取消时调用。返回 false 不关闭。未发布

另外接受除 header、footer 之外的全部 Popover 属性;trigger 默认是 click。浮层的角色是 alertdialog。