PopConfirm 气泡确认框

目标操作需要用户二次确认时,在目标附近弹出浮层询问。

何时使用

  • 需要在气泡中确认操作时。

基础用法

<script setup lang="ts">
import { PopConfirm, PopConfirmTrigger, PopConfirmContent, Button } from "@reglow/reui";

function handleConfirm() {
  console.log("confirmed");
}
</script>

<template>
  <PopConfirm>
    <PopConfirmTrigger>
      <Button variant="destructive">删除</Button>
    </PopConfirmTrigger>
    <PopConfirmContent
      title="确定删除这条数据?"
      description="删除后不可恢复,请谨慎操作"
      ok-text="删除"
      ok-variant="destructive"
      @confirm="handleConfirm"
    />
  </PopConfirm>
</template>

导入

import { PopConfirm, PopConfirmTrigger, PopConfirmContent } from "@reglow/reui";

Props(PopConfirmContent)

属性类型默认值说明
titlestring-标题
descriptionstring-描述
okTextstring跟随语言确认按钮文字
cancelTextstring跟随语言取消按钮文字
okVariantstring-确认按钮变体(如 destructive

事件

事件说明
confirm点击确认
cancel点击取消

国际化

okTextcancelText 默认跟随全局语言(zh-CN / zh-TW / en-US),传 prop 可覆盖。