vue项目切换页面echarts不显示的问题

记录一下，使用echarts碰到的问题，页面切换后，表不显示，而且不是百分百出现，多次点击页面切换页面，可能出现这个问题

 方案一：

手动删除 Echarts 默认生成的 _echarts_instance_ 属性 

const domMap = document.getElementById("你的图id");
// 清除Echarts默认添加的属性
domMap.removeAttribute("_echarts_instance_");
let myChart = this.$echarts.init(domMap);
myChart.setOption({})

方案二：

this.$nextTick(()=>{myChart.resize()})

使用 $nextTick 的回调 配合 echarts 子代的resize来重新设置图表的 宽高

建议在声明周期也使用：

  mounted() {
    this.$nextTick(() => {
      this.initChart()
    })
  },

总结：使用监听或路由守卫，等页面切换回来之后，手动强制刷新echarts表

如果是显示隐藏的话，尽量使用 v-if 。