Skip to content

气泡确认 Popconfirm

在元素附近弹出气泡确认框进行交互

基础用法

基础的气泡确认框

<template>
  <bp-popconfirm  content="请确认是否执行操作">
    <bp-button>Open popconfirm</bp-button>
  </bp-popconfirm>
</template>

异步关闭

通过 on-before-ok 控制确认框的异步关闭功能

<template>
  <bp-popconfirm content="请确认是否执行操作" :on-before-ok="handleBeforeOk">
    <bp-button>Open popconfirm</bp-button>
  </bp-popconfirm>
</template>

<script setup lang="ts">
const handleBeforeOk = async () => {
  await new Promise(resolve => setTimeout(resolve, 2000));
  return true;
};
</script>

Popconfirm 属性

content
文本内容
String
-
type
类型
Enum
info
position
弹出位置
Enum
top
okText
确认按钮文本
String
确认
cancleText
取消按钮文本
String
取消
on-before-ok
触发确定前的回调,返回 false 则中断
Function
() => true

Popconfirm 事件

ok
点击确认触发
-
cancle
点击取消触发
-