diff --git a/src/components/Charts/mixins/resize.js b/src/components/Charts/mixins/resize.js index dc61f859..c4c432f4 100644 --- a/src/components/Charts/mixins/resize.js +++ b/src/components/Charts/mixins/resize.js @@ -1,6 +1,11 @@ import { debounce } from '@/utils' export default { + data() { + return { + sidebarElm: null + } + }, mounted() { this.__resizeHandler = debounce(() => { if (this.chart) { @@ -9,14 +14,13 @@ export default { }, 100) window.addEventListener('resize', this.__resizeHandler) - const sidebarElm = document.getElementsByClassName('sidebar-container')[0] - sidebarElm.addEventListener('transitionend', this.sidebarResizeHandler) + this.sidebarElm = document.getElementsByClassName('sidebar-container')[0] + this.sidebarElm && this.sidebarElm.addEventListener('transitionend', this.sidebarResizeHandler) }, beforeDestroy() { window.removeEventListener('resize', this.__resizeHandler) - const sidebarElm = document.getElementsByClassName('sidebar-container')[0] - sidebarElm.removeEventListener('transitionend', this.sidebarResizeHandler) + this.sidebarElm && this.sidebarElm.removeEventListener('transitionend', this.sidebarResizeHandler) }, methods: { sidebarResizeHandler(e) { diff --git a/src/views/dashboard/admin/components/LineChart.vue b/src/views/dashboard/admin/components/LineChart.vue index ef493c4b..dfd121e5 100644 --- a/src/views/dashboard/admin/components/LineChart.vue +++ b/src/views/dashboard/admin/components/LineChart.vue @@ -32,7 +32,8 @@ export default { }, data() { return { - chart: null + chart: null, + sidebarElm: null } }, watch: { @@ -55,8 +56,8 @@ export default { } // 监听侧边栏的变化 - const sidebarElm = document.getElementsByClassName('sidebar-container')[0] - sidebarElm.addEventListener('transitionend', this.sidebarResizeHandler) + this.sidebarElm = document.getElementsByClassName('sidebar-container')[0] + this.sidebarElm && this.sidebarElm.addEventListener('transitionend', this.sidebarResizeHandler) }, beforeDestroy() { if (!this.chart) { @@ -66,8 +67,7 @@ export default { window.removeEventListener('resize', this.__resizeHandler) } - const sidebarElm = document.getElementsByClassName('sidebar-container')[0] - sidebarElm.removeEventListener('transitionend', this.sidebarResizeHandler) + this.sidebarElm && this.sidebarElm.removeEventListener('transitionend', this.sidebarResizeHandler) this.chart.dispose() this.chart = null