疑难杂症，记一次vue echarts 的不渲染问题？

Question

这是正常渲染的图，页面刷新或者第一次进入该页面（路由）的时候，都能正常刷新。
但是，从这个路由跳到别的路由后，然后再回来，也就是第二次进入该页面的时候，这个折线图就显出不出来了如下图，一片空白。

上面这一片空白是图片，不是没有东西啊。
在echarts渲染的过程中打了断点，发现渲染流程都执行了，也就是说，渲染了，只是看不见？

可以看见，该有的元素都有，我理解echarts其实是渲染了的。

除了是第二次进入该路由看不见页面外，再本地开发和测试环境都没有问题，唯独正式环境有这个问题。

这是渲染的代码，大了断点，包括if里面全都执行了的。

Answer 1

你这是应该是图表已经生成了，重复进来的时候图表还存在，需要判断图表是否已经存在，如果存在的话，就只需要把数据传进去，类似这种写法：

let chart;
if(chart){
 chart.setOption({
    series: [
      {
        data: [],
      }
    ]
  })
}

Answer 2

突然灵感一来

onBeforeUnmount(() => {
  if (myChart) myChart.dispose()
})

在离开路由的时候，需要把当前的echarts图表实例释放掉，就解决了