feat: 添加 useDialogRef 函数,优化对话框引用管理,更新对话框组件逻辑
Some checks failed
/ build-and-deploy-to-vercel (push) Failing after 34s
/ depcheck (push) Has been cancelled
/ playwright (push) Has been cancelled

This commit is contained in:
严浩
2024-12-14 21:54:51 +08:00
parent b9ad180d4c
commit 553d3be256
3 changed files with 16 additions and 6 deletions

View File

@ -1,3 +1,13 @@
<script setup lang="ts">
import { useDialogRef } from '@/utils/primevue';
const dialogRef = useDialogRef();
</script>
<template>
<div>dialog-content.vue</div>
<div mb-8>dialog-content.vue</div>
<div class="flex justify-end gap-2">
<Button type="button" label="关闭" severity="secondary" @click="dialogRef?.close"></Button>
<Button type="button" label="关闭" @click="dialogRef?.close"></Button>
</div>
</template>

View File

@ -1,7 +1,7 @@
<script lang="ts"></script>
<script setup lang="tsx">
import { ConfirmationService, DialogService, ToastService } from '@/utils/primevue';
import { ConfirmationService, DialogService, ToastService, useDialogRef } from '@/utils/primevue';
import dialogContent from './dialog-content.vue';
const dynamicComponent = defineComponent({
@ -12,7 +12,7 @@ const dynamicComponent = defineComponent({
},
},
setup(props, ctx) {
const dialogRef = inject<ComputedRef<DynamicDialogOptions>>('dialogRef');
const dialogRef = useDialogRef();
return () => (
<div>
<button onClick={() => ctx.emit('close')}>emit('close')</button> <hr />
@ -55,7 +55,6 @@ const openDialog = async () => {
DialogService.open(dialogContent, {
props: {
header: '对话框2',
position: 'bottomright',
// draggable: false, // Header1的 draggable: true 会影响 Header2如果指定 draggable: false则不会受到影响。
},
});

View File

@ -68,6 +68,7 @@ export const DialogService: DialogServiceMethods = {
},
};
declare global {
type DynamicDialogOptions = import('primevue/dynamicdialogoptions').DynamicDialogOptions;
export function useDialogRef() {
type DialogRef = ComputedRef<import('primevue/dynamicdialogoptions').DynamicDialogInstance>;
return inject<DialogRef>('dialogRef');
}