vue切换页面echarts图表不显示的问题
在vue项目中切换tab页面或者在后台管理框架中切换面包屑echarts图表会不显示,初次进入的时候能够正常显示,本地运行也没有问题,这个问题只在线上部署的时候出现。目前找到了两个解决方案,做下记录。echarts挂载的dom元素有一个属性:_echarts_instance_,它应该类似id,需要每次刷新重新生成,所以我们每次挂载前都去除这个属性。将echarts图表挂载的div的id改成动态i
·
在vue项目中切换tab页面或者在后台管理框架中切换面包屑echarts图表会不显示,初次进入的时候能够正常显示,本地运行也没有问题,这个问题只在线上部署的时候出现。目前找到了两个解决方案,做下记录。
方案一
将echarts图表挂载的div的id改成动态id,确保切换页面时,echarts图表每次都可以重新挂载。
<div :id="myChart" :style="{width: '100%', height: '400px'}"></div>
方案二
echarts挂载的dom元素有一个属性:_echarts_instance_,它应该类似id,需要每次刷新重新生成,所以我们每次挂载前都去除这个属性。
let myEchart = document.getElementById('main');
myEchart.removeAttribute('_echarts_instance_');
echarts.init(myEchart).setOption(data.multiple);
以上两个方案都测试可以解决这个问题。
更多推荐



所有评论(0)