Commit b5a36e86 by zsh

添加utils工具方法

parent 8105105e
...@@ -50,6 +50,14 @@ export default { ...@@ -50,6 +50,14 @@ export default {
} }
}, },
beforeDestroy () {
window.removeEventListener('resize', this.chartResize)
if (this.chart) {
this.chart.dispose()
this.chart = null
}
},
methods: { methods: {
/** /**
* @method initChart 初始化图表 * @method initChart 初始化图表
...@@ -58,20 +66,29 @@ export default { ...@@ -58,20 +66,29 @@ export default {
const { id = '', option = {} } = this.chartOpt const { id = '', option = {} } = this.chartOpt
if (id && option) { if (id && option) {
const currChartEl = document.getElementById(id) const currChartEl = document.getElementById(id)
// 无需滚动的图表, 初始化时先销毁, 防止重复创建
if (!this.isMove) { if (!this.isMove) {
this.echarts.dispose(currChartEl) // 先销毁, 防止重复创建 this.echarts.dispose(currChartEl)
} }
if (!this.chart) {
this.chart = this.echarts.init(currChartEl) this.chart = this.echarts.init(currChartEl)
}
// 渲染图表 // 渲染图表
this.chart.setOption(option, true) this.chart.setOption(option, true)
setTimeout(() => { // echarts图表自适应屏幕宽度 setTimeout(() => { // echarts图表自适应屏幕宽度
window.addEventListener('resize', () => { window.addEventListener('resize', this.chartResize)
this.chart.resize()
})
}, 200) }, 200)
} }
} },
/**
* @method chartResize 重置图表
*/
chartResize: throttle (function () {
this.chart && this.chart.resize()
}, 2000)
} }
} }
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment