Vue3.x + Echarts5.x 关于echarts 在本地运行正常 部署到线上环境 切换路由显示空白图

在使用vue3.0开发新项目时，遇到本地环境echarts图切换路由正常但是部署到线上环境切换路由其会显示空白图。项目问题图如下：

本地环境图：

线上显示图：

原因：由于echars机制原因 再次进入页面创建新的canvas 需要清空之前的echarts图，如果未清除，echarts 就会显示失败

解决方法：可以在在页面卸载时释放echarts

具体代码：

<div id="linechart" class="linechart" />

echarts挂载的dom元素有一个属性：echarts_instance，它应该类似id，需要每次刷新重新生成，所以我们每次挂载前都去除这个属性，具体看以下代码:

   const linechart = echarts.init(document.getElementById('linechart'))
      // 重要代码 在进入或者离开时销毁echarts
      document.getElementById('linechart').setAttribute('_echarts_instance_', '')
      linechart && linechart.setOption(lineoptions)
      // 大小自适应
      window.addEventListener('resize', () => {
        linechart.resize()
      })