fix(ui): overlay销毁需要异常page上的事件

This commit is contained in:
roymondchen 2024-06-11 19:31:34 +08:00
parent 5ac768f15b
commit 094635cc0e
2 changed files with 32 additions and 6 deletions

View File

@ -4,10 +4,10 @@
</magic-ui-container> </magic-ui-container>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from 'vue'; import { defineComponent, onBeforeUnmount, ref } from 'vue';
import Core from '@tmagic/core'; import Core from '@tmagic/core';
import type { MNode } from '@tmagic/schema'; import type { MContainer, MNode, MPage } from '@tmagic/schema';
import useApp from '../../useApp'; import useApp from '../../useApp';
@ -43,12 +43,25 @@ export default defineComponent({
} }
}; };
app?.page?.on('editor:select', (info, path) => { const editorSelectHandler = (
info: {
node: MNode;
page: MPage;
parent: MContainer;
},
path: MNode[],
) => {
if (path.find((node: MNode) => node.id === props.config.id)) { if (path.find((node: MNode) => node.id === props.config.id)) {
openOverlay(); openOverlay();
} else { } else {
closeOverlay(); closeOverlay();
} }
};
app?.page?.on('editor:select', editorSelectHandler);
onBeforeUnmount(() => {
app?.page?.off('editor:select', editorSelectHandler);
}); });
return { return {

View File

@ -5,9 +5,9 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from 'vue'; import { onBeforeUnmount, ref } from 'vue';
import type { MContainer, MNode } from '@tmagic/schema'; import type { MContainer, MNode, MPage } from '@tmagic/schema';
import useApp from '../../useApp'; import useApp from '../../useApp';
@ -41,11 +41,24 @@ const { app, node } = useApp({
}, },
}); });
app?.page?.on('editor:select', (info, path) => { const editorSelectHandler = (
info: {
node: MNode;
page: MPage;
parent: MContainer;
},
path: MNode[],
) => {
if (path.find((node: MNode) => node.id === props.config.id)) { if (path.find((node: MNode) => node.id === props.config.id)) {
node?.instance.openOverlay(); node?.instance.openOverlay();
} else { } else {
node?.instance.closeOverlay(); node?.instance.closeOverlay();
} }
};
app?.page?.on('editor:select', editorSelectHandler);
onBeforeUnmount(() => {
app?.page?.off('editor:select', editorSelectHandler);
}); });
</script> </script>