Skip to content

Commit 9bd5a19

Browse files
authored
fix: alert action button focus, fixed vbenjs#5921 (vbenjs#5922)
* 修复Alert组件的按钮焦点切换问题
1 parent 86da3ce commit 9bd5a19

File tree

2 files changed

+7
-3
lines changed
  • packages/@core/ui-kit/popup-ui/src/alert
  • playground/src/views/examples/modal

2 files changed

+7
-3
lines changed

packages/@core/ui-kit/popup-ui/src/alert/alert.vue

+4-3
Original file line numberDiff line numberDiff line change
@@ -138,7 +138,7 @@ async function handleOpenChange(val: boolean) {
138138
<div class="flex items-center">
139139
<component :is="getIconRender" class="mr-2" />
140140
<span class="flex-auto">{{ $t(title) }}</span>
141-
<AlertDialogCancel v-if="showCancel">
141+
<AlertDialogCancel v-if="showCancel" as-child>
142142
<VbenButton
143143
variant="ghost"
144144
size="icon"
@@ -158,16 +158,17 @@ async function handleOpenChange(val: boolean) {
158158
<VbenLoading v-if="loading && contentMasking" :spinning="loading" />
159159
</AlertDialogDescription>
160160
<div class="flex justify-end gap-x-2" :class="`justify-${buttonAlign}`">
161-
<AlertDialogCancel v-if="showCancel" :disabled="loading">
161+
<AlertDialogCancel v-if="showCancel" as-child>
162162
<component
163163
:is="components.DefaultButton || VbenButton"
164+
:disabled="loading"
164165
variant="ghost"
165166
@click="handleCancel"
166167
>
167168
{{ cancelText || $t('cancel') }}
168169
</component>
169170
</AlertDialogCancel>
170-
<AlertDialogAction>
171+
<AlertDialogAction as-child>
171172
<component
172173
:is="components.PrimaryButton || VbenButton"
173174
:loading="loading"

playground/src/views/examples/modal/index.vue

+3
Original file line numberDiff line numberDiff line change
@@ -261,6 +261,9 @@ async function openPrompt() {
261261
</template>
262262
</Card>
263263
<Card class="w-[300px]" title="轻量提示弹窗">
264+
<template #extra>
265+
<DocButton path="/components/common-ui/vben-alert" />
266+
</template>
264267
<p>通过快捷方法创建动态提示弹窗,适合一些轻量的提示和确认、输入等</p>
265268
<template #actions>
266269
<Button type="primary" @click="openAlert">Alert</Button>

0 commit comments

Comments
 (0)