changeset 3924:2efda3391fa8

client: waterlevel diagram: fixed handing of resize listener
author Markus Kottlaender <markus@intevation.de>
date Thu, 11 Jul 2019 16:18:58 +0200
parents 50a0b6d3b032
children 4f93bfb5725d
files client/src/components/gauge/Waterlevel.vue
diffstat 1 files changed, 4 insertions(+), 3 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/gauge/Waterlevel.vue	Thu Jul 11 16:18:25 2019 +0200
+++ b/client/src/components/gauge/Waterlevel.vue	Thu Jul 11 16:18:58 2019 +0200
@@ -1164,7 +1164,8 @@
     }
   },
   created() {
-    window.addEventListener("resize", debounce(this.drawDiagram), 100);
+    this.resizeListenerFunction = debounce(this.drawDiagram, 100);
+    window.addEventListener("resize", this.resizeListenerFunction);
   },
   mounted() {
     // Nasty but necessary if we don't want to use the updated hook to re-draw
@@ -1174,7 +1175,7 @@
     // should be possible with $nextTick() but it doesn't work because it does
     // not guarantee that the DOM is not only updated but also re-painted on the
     // screen.
-    setTimeout(this.drawDiagram, 50);
+    setTimeout(this.drawDiagram, 150);
 
     this.templates[0] = this.defaultTemplate;
     this.form.template = this.templates[0];
@@ -1202,7 +1203,7 @@
       });
   },
   destroyed() {
-    window.removeEventListener("resize", debounce(this.drawDiagram));
+    window.removeEventListener("resize", this.resizeListenerFunction);
   }
 };
 </script>