chore(stage): 优化高亮性能

This commit is contained in:
roymondchen 2023-08-21 19:39:14 +08:00
parent 0274c36afd
commit 5de5fc933a
2 changed files with 20 additions and 13 deletions

View File

@ -95,14 +95,14 @@ export default class StageDragResize extends MoveableOptionsManager {
Object.entries(options).forEach(([key, value]) => {
(this.moveable as any)[key] = value;
});
this.moveable.updateTarget();
this.moveable.updateRect();
}
public clearSelectStatus(): void {
if (!this.moveable) return;
this.dragResizeHelper.destroyShadowEl();
this.moveable.target = null;
this.moveable.updateTarget();
this.moveable.updateRect();
}
/**

View File

@ -28,7 +28,7 @@ export default class StageHighlight extends EventEmitter {
public container: HTMLElement;
public target?: HTMLElement;
public moveable?: Moveable;
public targetShadow: TargetShadow;
public targetShadow?: TargetShadow;
private getRootContainer: GetRootContainer;
constructor(config: StageHighlightConfig) {
@ -52,14 +52,19 @@ export default class StageHighlight extends EventEmitter {
public highlight(el: HTMLElement): void {
if (!el || el === this.target) return;
this.target = el;
this.moveable?.destroy();
this.moveable = new Moveable(this.container, {
target: this.targetShadow.update(el),
origin: false,
rootContainer: this.getRootContainer(),
zoom: 2,
});
this.targetShadow?.update(el);
if (this.moveable) {
this.moveable.zoom = 2;
this.moveable.updateRect();
} else {
this.moveable = new Moveable(this.container, {
target: this.targetShadow?.el,
origin: false,
rootContainer: this.getRootContainer(),
zoom: 2,
});
}
}
/**
@ -67,9 +72,9 @@ export default class StageHighlight extends EventEmitter {
*/
public clearHighlight(): void {
if (!this.moveable || !this.target) return;
this.moveable.zoom = 0;
this.moveable.updateRect();
this.target = undefined;
this.moveable.target = null;
this.moveable.updateTarget();
}
/**
@ -77,6 +82,8 @@ export default class StageHighlight extends EventEmitter {
*/
public destroy(): void {
this.moveable?.destroy();
this.targetShadow.destroy();
this.targetShadow?.destroy();
this.moveable = undefined;
this.targetShadow = undefined;
}
}