最近在学习和使用echarts时遇到了自适应问题,通过度娘顺利的找到了resize的解决方案,但是当一个页面中出现多个图表时就会导致resize失效问题。MMP被这个问题困扰了好几天,好在最后终于找到答案特此记录一下。
错误示例:
window.onresize = () => {
console.log('chart5重绘')
this.chart5.target.resize()
}
当存在多个echarts图表时导致失效
当缩小浏览器窗口时明显看到图表1未能成功重绘
正确示例:
window.addEventListener('resize', () => {
this.chart4.target.resize()
})
在使用window.onresize监听窗口变化时,要使用DOM二级绑定方式:addEventListener方式。