Add before destroy for layers

schmiedeone · Oct 2, 2017 · 0d03ee9 · 0d03ee9
1 parent a34abe3
commit 0d03ee9
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 34 deletions.
diff --git a/src/components/GeoJSON.vue b/src/components/GeoJSON.vue
@@ -17,7 +17,7 @@ export default {
   watch: {
     geojson: {
       handler(newVal) {
-        this.$geoJSON.clearLayers()
+        this.mapObject.clearLayers()
         this.addGeoJSONData(newVal);
       },
       deep: true,
@@ -26,28 +26,31 @@ export default {
   methods: {
     deferredMountedTo(parent) {
       this.parent = parent;
-      this.$geoJSON.addTo(parent);
+      this.mapObject.addTo(parent);
       for (var i = 0; i < this.$children.length; i++) {
         this.$children[i].deferredMountedTo(parent);
       }
     },
     addGeoJSONData(geojsonData) {
-      this.$geoJSON.addData(geojsonData);
+      this.mapObject.addData(geojsonData);
     },
     getGeoJSONData() {
-      return this.$geoJSON.toGeoJSON();
+      return this.mapObject.toGeoJSON();
     },
     getBounds() {
-      return this.$geoJSON.getBounds();
+      return this.mapObject.getBounds();
     },
     setVisible(newVal, oldVal) {
       if (newVal === oldVal) return;
       if (newVal) {
-        this.$geoJSON.addTo(this.parent);
+        this.mapObject.addTo(this.parent);
       } else {
-        this.parent.removeLayer(this.$geoJSON);
+        this.parent.removeLayer(this.mapObject);
       }
     },
+  },
+  beforeDestroy() {
+    this.$parent.mapObject.removeLayer(this.mapObject);
   }
 };
 </script>
diff --git a/src/components/ImageOverlay.vue b/src/components/ImageOverlay.vue
@@ -68,6 +68,9 @@ export default {
     getBounds() {
       return this.mapObject.getBounds();
     },
+  },
+  beforeDestroy() {
+    this.$parent.mapObject.removeLayer(this.mapObject);
   }
 };
 </script>
diff --git a/src/components/TileLayer.vue b/src/components/TileLayer.vue
@@ -49,35 +49,38 @@ const props = {
 };
 
 export default {
-    props: props,
-    mounted() {
-      const otherPropertytoInitialize = [ "attribution", "token", "opacity", "zIndex" ];
-      for (var i = 0; i < otherPropertytoInitialize.length; i++) {
-        const propName = otherPropertytoInitialize[i];
-        if(this[propName]) {
-          options[propName] = this[propName];
-        }
+  props: props,
+  mounted() {
+    const otherPropertytoInitialize = [ "attribution", "token", "opacity", "zIndex" ];
+    for (var i = 0; i < otherPropertytoInitialize.length; i++) {
+      const propName = otherPropertytoInitialize[i];
+      if(this[propName]) {
+        options[propName] = this[propName];
       }
-      this.mapObject = L.tileLayer(this.url, this.options);
-      eventsBinder(this, this.mapObject, events);
-      propsBinder(this, this.mapObject, props);
-    },
-    methods: {
-      deferredMountedTo(parent) {
-        this.mapObject.addTo(parent);
-        this.attributionControl = parent.attributionControl;
-        var that = this.mapObject;
-        for (var i = 0; i < this.$children.length; i++) {
-          this.$children[i].deferredMountedTo(that);
-        }
-      },
-      setAttribution(val, old) {
-        this.attributionControl.removeAttribution(old);
-        this.attributionControl.addAttribution(val);
-      },
-      setToken(val) {
-        this.options.token = val;
+    }
+    this.mapObject = L.tileLayer(this.url, this.options);
+    eventsBinder(this, this.mapObject, events);
+    propsBinder(this, this.mapObject, props);
+  },
+  methods: {
+    deferredMountedTo(parent) {
+      this.mapObject.addTo(parent);
+      this.attributionControl = parent.attributionControl;
+      var that = this.mapObject;
+      for (var i = 0; i < this.$children.length; i++) {
+        this.$children[i].deferredMountedTo(that);
       }
+    },
+    setAttribution(val, old) {
+      this.attributionControl.removeAttribution(old);
+      this.attributionControl.addAttribution(val);
+    },
+    setToken(val) {
+      this.options.token = val;
     }
+  },
+  beforeDestroy() {
+    this.$parent.mapObject.removeLayer(this.mapObject);
+  }
 };
 </script>