vue中使用echarts（含自适应监听及移除）
<script>
export default {
name: 'BarItemCharts',
data () {
return {
chartIns: '',
options: {}
}
},
mounted () {
this.init()
window.addEventListener('resize', this.onResize)
},
methods: {
init () {
this.options = {...} // 此处写echarts配置
if (!this.chartIns) {
this.chartIns = this.$echarts.init(this.$refs.canvas)
}
this.chartIns.setOption(this.options)
},
onResize () {
// 刚方法是为了确保addEventListener和removeEventListener的东西是同一个
if (this.chartIns) {
this.chartIns.resize()
}
}
},
beforeDestroy () {
window.removeEventListener('resize', this.onResize)
if (this.chartIns) {
this.chartIns.dispose()
}
}
}
</script>