chore(wrapper): cleanup watchEffect as it's not needed.

Properties that are sent from vue to vugel will still update fine because of reactivity.
Planning-nl · Jul 16, 2020 · ad33397 · ad33397
1 parent ace01bd
commit ad33397
Showing 1 changed file with 23 additions and 28 deletions.
diff --git a/src/wrapper.ts b/src/wrapper.ts
@@ -31,42 +31,37 @@ export const Vugel = defineComponent({
         const vugelComponentInstance = getCurrentInstance()!;
 
         onMounted(() => {
-            let rendered = false;
             let vugelRenderer: RootRenderFunction;
             let stage: VugelStage;
             let stageRoot: Root;
 
-            watchEffect(() => {
-                if (!rendered && elRef.value) {
-                    rendered = true;
+            if (elRef.value) {
+                stage = new Stage(elRef.value, { ...props.settings }) as VugelStage;
+                stage.eventHelpers = setupEvents(props.settings?.eventsTarget || elRef.value, stage);
 
-                    stage = new Stage(elRef.value, { ...props.settings }) as VugelStage;
-                    stage.eventHelpers = setupEvents(props.settings?.eventsTarget || elRef.value, stage);
+                vugelRenderer = createRendererForStage(stage);
+                stageRoot = new Root(stage, stage.root);
 
-                    vugelRenderer = createRendererForStage(stage);
-                    stageRoot = new Root(stage, stage.root);
+                // Auto-inherit dimensions.
+                stageRoot["func-w"] = (w: number) => w;
+                stageRoot["func-h"] = (w: number, h: number) => h;
 
-                    // Auto-inherit dimensions.
-                    stageRoot["func-w"] = (w: number) => w;
-                    stageRoot["func-h"] = (w: number, h: number) => h;
+                // Keep correct aspect-ratio issues when the page is zoomed out.
+                const maxTextureSize = stage.getMaxTextureSize();
+                maxWidth.value = maxTextureSize / stage.pixelRatio;
+                maxHeight.value = maxTextureSize / stage.pixelRatio;
+            }
 
-                    // Keep correct aspect-ratio issues when the page is zoomed out.
-                    const maxTextureSize = stage.getMaxTextureSize();
-                    maxWidth.value = maxTextureSize / stage.pixelRatio;
-                    maxHeight.value = maxTextureSize / stage.pixelRatio;
-                }
-
-                const defaultSlot = setupContext.slots.default;
-                if (defaultSlot) {
-                    // We must wait until nextTick to prevent interference in the effect queue.
-                    nextTick().then(() => {
-                        const node = h(Connector, defaultSlot);
-                        vugelRenderer(node, stageRoot);
-                    });
-                } else {
-                    console.warn("No default slot is defined");
-                }
-            });
+            const defaultSlot = setupContext.slots.default;
+            if (defaultSlot) {
+                // We must wait until nextTick to prevent interference in the effect queue.
+                nextTick().then(() => {
+                    const node = h(Connector, defaultSlot);
+                    vugelRenderer(node, stageRoot);
+                });
+            } else {
+                console.warn("No default slot is defined");
+            }
         });
 
         /**