气泡确认框 Popconfirm - Ant Design

点击元素，弹出气泡式的确认框。

何时使用

目标元素的操作需要用户进一步的确认时，在目标元素附近弹出浮层提示，询问用户。

和 confirm 弹出的全屏居中模态对话框相比，交互形式更轻量。

代码演示

最简单的用法，支持确认标题和描述。

description 在 5.1.0 版本中支持。

位置有十二个方向。如需箭头指向目标元素中心，可以设置 arrow: { pointAtCenter: true }。

自定义 Icon 图标

自定义提示 icon。

基于 Promise 的异步关闭

点击确定后异步关闭 Popconfirm，例如提交表单。

使用 okText 和 cancelText 自定义按钮文字。

Whether directly execute：

可以判断是否需要弹出。

点击确定后异步关闭气泡确认框，例如提交表单。

API

通用属性参考：通用属性

参数	说明	类型	默认值	版本
cancelButtonProps	cancel 按钮 props	ButtonProps	-
cancelText	取消按钮文字	string	`取消`
disabled	阻止点击 Popconfirm 子元素时弹出确认框	boolean	false
icon	自定义弹出气泡 Icon 图标	ReactNode	<ExclamationCircle />
okButtonProps	ok 按钮 props	ButtonProps	-
okText	确认按钮文字	string	`确定`
okType	确认按钮类型	string	`primary`
showCancel	是否显示取消按钮	boolean	true	4.18.0
title	确认框标题	ReactNode \| () => ReactNode	-
description	确认内容的详细描述	ReactNode \| () => ReactNode	-	5.1.0
onCancel	点击取消的回调	function(e)	-
onConfirm	点击确认的回调	function(e)	-
onPopupClick	弹出气泡点击事件	function(e)	-	5.5.0

更多属性请参考 Tooltip。

主题变量（Design Token）

组件 Token如何定制？

Token 名称	描述	类型	默认值
zIndexPopup	确认框 z-index	number	1060

全局 Token如何定制？

注意

请确保 Popconfirm 的子元素能接受 onMouseEnter、onMouseLeave、onFocus、onClick 事件。