fix: 修复 FaDrawer 和 FaModal 组件开启时警告错误

This commit is contained in:
Hooray
2026-04-19 21:48:44 +08:00
parent 42b7ab33c6
commit cf4a7eae7d
26 changed files with 15 additions and 0 deletions
View File
+5
View File
@@ -50,6 +50,7 @@ const slots = defineSlots<{
footer?: () => VNode
}>()
const sheetContentRef = useTemplateRef('sheetContentRef')
const drawerId = shallowRef(props.id ?? useId())
const isOpen = ref(props.modelValue)
@@ -140,6 +141,9 @@ function handleOpenAutoFocus(e: Event) {
if (!props.openAutoFocus) {
e.preventDefault()
e.stopPropagation()
nextTick(() => {
sheetContentRef.value?.el?.$el?.focus()
})
}
}
@@ -176,6 +180,7 @@ function handleAnimationEnd() {
<template>
<Sheet :open="isOpen" @update:open="updateOpen">
<SheetContent
ref="sheetContentRef"
:drawer-id="drawerId"
:open="isOpen"
:z-index="props.zIndex"
View File
View File
+7
View File
@@ -38,6 +38,12 @@ const delegatedProps = reactiveOmit(props, 'class', 'side')
const forwarded = useForwardPropsEmits(delegatedProps, emits)
const sheetContentRef = useTemplateRef<ComponentPublicInstance<typeof DialogContent>>('sheetContentRef')
defineExpose({
el: sheetContentRef,
})
const showOverlay = computed(() => props.open && props.overlay)
</script>
@@ -67,6 +73,7 @@ const showOverlay = computed(() => props.open && props.overlay)
</Transition>
<SheetOverlay class="hidden" />
<DialogContent
ref="sheetContentRef"
data-slot="sheet-content"
:class="cn(
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
View File
+3
View File
@@ -174,6 +174,9 @@ function handleOpenAutoFocus(e: Event) {
if (!props.openAutoFocus) {
e.preventDefault()
e.stopPropagation()
nextTick(() => {
dialogContentRef.value?.el?.$el?.focus()
})
}
}
View File