From e138bbe9c14a87035a647de7fec6055bf36e5354 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8A=B1=E8=A3=A4=E8=A1=A9?= <panfree23@gmail.com>
Date: Wed, 8 Jan 2020 17:59:42 +0800
Subject: [PATCH] fix[Charts]: fix charts resize in keep-alive bug

---
 src/components/Charts/mixins/resize.js | 40 ++++++++++++++++++--------
 1 file changed, 28 insertions(+), 12 deletions(-)

diff --git a/src/components/Charts/mixins/resize.js b/src/components/Charts/mixins/resize.js
index dccaf1a8..d1812f22 100644
--- a/src/components/Charts/mixins/resize.js
+++ b/src/components/Charts/mixins/resize.js
@@ -7,20 +7,17 @@ export default {
     }
   },
   mounted() {
-    this.__resizeHandler = debounce(() => {
-      if (this.chart) {
-        this.chart.resize()
-      }
-    }, 100)
-    window.addEventListener('resize', this.__resizeHandler)
-
-    this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
-    this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
+    this.initListener()
+  },
+  activated() {
+    this.resize()
+    this.initListener()
   },
   beforeDestroy() {
-    window.removeEventListener('resize', this.__resizeHandler)
-
-    this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
+    this.destroyListener()
+  },
+  deactivated() {
+    this.destroyListener()
   },
   methods: {
     // use $_ for mixins properties
@@ -29,6 +26,25 @@ export default {
       if (e.propertyName === 'width') {
         this.__resizeHandler()
       }
+    },
+    initListener() {
+      this.__resizeHandler = debounce(() => {
+        this.resize()
+      }, 100)
+      window.addEventListener('resize', this.__resizeHandler)
+
+      this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
+      this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
+    },
+    destroyListener() {
+      window.removeEventListener('resize', this.__resizeHandler)
+
+      this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
+    },
+    resize() {
+      if (this.chart) {
+        this.chart.resize()
+      }
     }
   }
 }