github_mirrors/gf-vben-admin
1
0
Fork 0
mirror of https://github.com/vbenjs/gf-vben-admin.git synced 2025-01-23 20:00:19 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf: optimize preview and ContextMenu functions

Browse Source
This commit is contained in:
nebv 2020-10-13 21:53:16 +08:00
parent a7c097034a
commit bbfb06f0ad
2 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/ContextMenu/index.ts
View File

@ -1,7 +1,7 @@
import contextMenuVue from './src/index';
import { isClient } from '/@/utils/is';
import { Options, Props } from './src/types';
import { createApp } from 'vue';
import { createVNode, render } from 'vue';
const menuManager: {
doms: Element[];
resolve: Fn;
@ -19,7 +19,7 @@ export const createContextMenu = function (options: Options) {
if (!isClient) return;
return new Promise((resolve) => {
const wrapDom = document.createElement('div');
const container = document.createElement('div');
const propsData: Partial<Props> = {};
if (options.styles !== undefined) propsData.styles = options.styles;
if (options.items !== undefined) propsData.items = options.items;
@ -27,12 +27,12 @@ export const createContextMenu = function (options: Options) {
propsData.customEvent = event;
propsData.axis = { x: event.clientX, y: event.clientY };
}
createApp(contextMenuVue, propsData).mount(wrapDom);
const vm = createVNode(contextMenuVue, propsData);
render(vm, container);
const bodyClick = function () {
menuManager.resolve('');
};
const contextMenuDom = wrapDom.children[0];
menuManager.doms.push(contextMenuDom);
menuManager.doms.push(container);
const remove = function () {
menuManager.doms.forEach((dom: Element) => {
try {
@ -41,16 +41,13 @@ export const createContextMenu = function (options: Options) {
});
document.body.removeEventListener('click', bodyClick);
document.body.removeEventListener('scroll', bodyClick);
try {
(wrapDom as any) = null;
} catch (error) {}
};
menuManager.resolve = function (...arg: any) {
resolve(arg[0]);
remove();
};
remove();
document.body.appendChild(contextMenuDom);
document.body.appendChild(container);
document.body.addEventListener('click', bodyClick);
document.body.addEventListener('scroll', bodyClick);
});

13
src/components/Preview/src/functional.ts
View File

@ -3,19 +3,20 @@ import { isClient } from '/@/utils/is';
import type { Options, Props } from './types';
import { createApp } from 'vue';
import { createVNode, render } from 'vue';
let instance: any = null;
export function createImgPreview(options: Options) {
if (!isClient) return;
const { imageList, show = true, index = 0 } = options;
const propsData: Partial<Props> = {};
const wrapDom = document.createElement('div');
const container = document.createElement('div');
propsData.imageList = imageList;
propsData.show = show;
propsData.index = index;
const imgDom = createApp(ImgPreview, propsData);
imgDom.mount(wrapDom);
const imgPreviewDom = wrapDom.children[0];
document.body.appendChild(imgPreviewDom);
instance = createVNode(ImgPreview, propsData);
render(instance, container);
document.body.appendChild(container);
}