Popconfirm

A simple confirmation dialog of an element click action.

TIP

This component requires the <client-only></client-only> wrap when used in SSR (eg: Nuxt) and SSG (eg: VitePress).

Basic usage

Popconfirm is similar to Popover. So for some duplicated attributes, please refer to the documentation of Popover.

Customize

You can customize Popconfirm like:

Trigger event

Click the button to trigger the event

API

Attributes

NameDescriptionTypeDefault
titleTitlestring—
confirm-button-textConfirm button textstring—
cancel-button-textCancel button textstring—
confirm-button-typeConfirm button typeenumprimary
cancel-button-typeCancel button typeenumtext
iconIcon Componentstring / ComponentQuestionFilled
icon-colorIcon colorstring#f90
hide-iconis hide Iconbooleanfalse
hide-afterdelay of disappear, in millisecondnumber200
teleportedwhether popconfirm is teleported to the bodybooleantrue
persistentwhen popconfirm inactive and persistent is false , popconfirm will be destroyedbooleanfalse
widthpopconfirm width, min width 150pxstring / number150

Events

NameDescriptionType
confirmtriggers when click confirm buttonFunction
canceltriggers when click cancel buttonFunction

Slots

NameDescription
referenceHTML element that triggers Popconfirm

Source

Component • Docs

Contributors