fix(editor): 切换选中组件后组件属性表单内存未释放

fix #123
This commit is contained in:
roymondchen 2022-11-23 17:54:01 +08:00
parent 5ae32f0792
commit eacc4dc794

View File

@ -1,15 +1,16 @@
<template> <template>
<div class="m-editor-props-panel"> <div class="m-editor-props-panel">
<slot name="props-panel-header"></slot> <slot name="props-panel-header"></slot>
<m-form <MForm
ref="configForm" ref="configForm"
:key="node?.type"
:class="`m-editor-props-panel ${propsPanelSize}`" :class="`m-editor-props-panel ${propsPanelSize}`"
:popper-class="`m-editor-props-panel-popper ${propsPanelSize}`" :popper-class="`m-editor-props-panel-popper ${propsPanelSize}`"
:size="propsPanelSize" :size="propsPanelSize"
:init-values="values" :init-values="values"
:config="curFormConfig" :config="curFormConfig"
@change="submit" @change="submit"
></m-form> ></MForm>
</div> </div>
</template> </template>
@ -17,7 +18,8 @@
import { computed, getCurrentInstance, inject, onMounted, ref, watchEffect } from 'vue'; import { computed, getCurrentInstance, inject, onMounted, ref, watchEffect } from 'vue';
import { tMagicMessage } from '@tmagic/design'; import { tMagicMessage } from '@tmagic/design';
import type { FormValue, MForm } from '@tmagic/form'; import type { FormValue } from '@tmagic/form';
import { MForm } from '@tmagic/form';
import type { MNode } from '@tmagic/schema'; import type { MNode } from '@tmagic/schema';
import type StageCore from '@tmagic/stage'; import type StageCore from '@tmagic/stage';
@ -32,7 +34,9 @@ const configForm = ref<InstanceType<typeof MForm>>();
const curFormConfig = ref<any>([]); const curFormConfig = ref<any>([]);
const services = inject<Services>('services'); const services = inject<Services>('services');
const node = computed(() => services?.editorService.get<MNode | null>('node')); const node = computed(() => services?.editorService.get<MNode | null>('node'));
const propsPanelSize = computed(() => services?.uiService.get('propsPanelSize') || 'small'); const propsPanelSize = computed(
() => services?.uiService.get<'large' | 'default' | 'small'>('propsPanelSize') || 'small',
);
const stage = computed(() => services?.editorService.get<StageCore>('stage')); const stage = computed(() => services?.editorService.get<StageCore>('stage'));
const init = async () => { const init = async () => {