vue3 + vite打包后,切换页面echart图不加载显示

vue3 + vite打包后,切换到另一个页面,再切换回来,echarts不触发更新, 是因为离开页面时实例并没有被销毁的,再次进入这个页面的时候,不会触发生命周期函数来更新数据。
可以在echarts那个页面的钩子函数中打个断点,看看能不能走到生命周期里面去。如果没有走进去,那么就证明当你离开这个页面时,没销毁echart实例,或者是你app.vue里面有keep-alive,有缓存导致的.

可以在离开页面时销毁echart

 import {
    
     onMounted, onBeforeUnmount} from "vue";
 import * as echarts from "echarts";
 export default {
    
    
  	setup() {
    
    
		   let myChart1 = null;
		    myChart1 = echarts.init(document.getElementById(id));
		   ...

 			onBeforeUnmount(()=> {
    
    
                myChart1.dispose(); //销毁
            })

	}
}

猜你喜欢

转载自blog.csdn.net/qq_37656005/article/details/119904510