zuaa
/
vue-vben-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(BasicDrawer): remove toRaw props (#3399)

This commit is contained in:
bowen 2023-12-11 17:55:01 +08:00 committed by GitHub
parent 0a1a5ffedc
commit 57e6e4f004
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/Drawer/src/BasicDrawer.vue
View File

@ -2,7 +2,7 @@
<Drawer v-bind="getBindValues" :class="prefixCls" @close="onClose"> <Drawer v-bind="getBindValues" :class="prefixCls" @close="onClose">
<template #title v-if="!$slots.title"> <template #title v-if="!$slots.title">
<DrawerHeader <DrawerHeader
:title="mergeProps.title" :title="getMergeProps.title"
:isDetail="isDetail" :isDetail="isDetail"
:showDetailBack="showDetailBack" :showDetailBack="showDetailBack"
@close="onClose" @close="onClose"
@ -32,8 +32,8 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { DrawerInstance, DrawerProps } from './typing'; import type { DrawerInstance, DrawerProps } from './typing';
import type { CSSProperties } from 'vue'; import { ref, computed, watch, unref, nextTick, getCurrentInstance } from 'vue';
import { ref, computed, watch, unref, nextTick, toRaw, getCurrentInstance } from 'vue'; import type { CSSProperties, Ref } from 'vue';
import { Drawer } from 'ant-design-vue'; import { Drawer } from 'ant-design-vue';
import { useI18n } from '@/hooks/web/useI18n'; import { useI18n } from '@/hooks/web/useI18n';
import { isFunction, isNumber } from '@/utils/is'; import { isFunction, isNumber } from '@/utils/is';
@ -53,13 +53,13 @@
const openRef = ref(false); const openRef = ref(false);
const attrs = useAttrs(); const attrs = useAttrs();
const propsRef = ref<Partial<DrawerProps | null>>(null); const propsRef = ref({}) as Ref<Partial<DrawerProps>>;
const { t } = useI18n(); const { t } = useI18n();
const { prefixVar, prefixCls } = useDesign('basic-drawer'); const { prefixVar, prefixCls } = useDesign('basic-drawer');
const drawerInstance: DrawerInstance = { const drawerInstance: DrawerInstance = {
setDrawerProps: setDrawerProps as any, setDrawerProps,
emitOpen: undefined, emitOpen: undefined,
}; };
@ -67,12 +67,12 @@
instance && emit('register', drawerInstance, instance.uid); instance && emit('register', drawerInstance, instance.uid);
const getMergeProps = computed((): DrawerProps => { const getMergeProps = computed(() => {
return deepMerge(toRaw(props), unref(propsRef)) as any; return deepMerge(props, unref(propsRef));
}); });
const getProps = computed((): DrawerProps => { const getProps = computed(() => {
const opt = { const opt: Partial<DrawerProps> = {
placement: 'right', placement: 'right',
...unref(attrs), ...unref(attrs),
...unref(getMergeProps), ...unref(getMergeProps),
@ -91,10 +91,10 @@
opt.getContainer = `.${prefixVar}-layout-content`; opt.getContainer = `.${prefixVar}-layout-content`;
} }
} }
return opt as DrawerProps; return opt;
}); });
const getBindValues = computed((): DrawerProps => { const getBindValues = computed(() => {
return { return {
...attrs, ...attrs,
...unref(getProps), ...unref(getProps),
@ -152,9 +152,9 @@
openRef.value = false; openRef.value = false;
} }
function setDrawerProps(props: Partial<DrawerProps>): void { function setDrawerProps(props: Partial<DrawerProps>) {
// Keep the last setDrawerProps // Keep the last setDrawerProps
propsRef.value = deepMerge(unref(propsRef) || ({} as any), props); propsRef.value = deepMerge(unref(propsRef), props);
if (Reflect.has(props, 'open')) { if (Reflect.has(props, 'open')) {
openRef.value = !!props.open; openRef.value = !!props.open;
@ -164,8 +164,6 @@
function handleOk() { function handleOk() {
emit('ok'); emit('ok');
} }
const mergeProps = getMergeProps as any;
</script> </script>
<style lang="less"> <style lang="less">
@header-height: 60px; @header-height: 60px;