解决echarts图表在本地运行正常，部署后切换组件不显示的问题

问题描述

在用vue3写后台管理系统时，在主页会需要用到echarts图表展示数据，在本地调试时正常，但部署到服务器上访问时，切换标签栏会出现echarts图表不显示的情况。

解决方法

经过查阅后，发现在切换标签时销毁echarts图表容器可以解决问题

<script>
  import { ref, onUnmounted } from 'vue';
  export default {
    setup() {
      let isShowEcharts = ref(true);
      
      onUnmounted(() => {
        isShowEcharts.value = false;
      });
      
       return {
         isShowEcharts,
       };
    },
  };
</script>

<template>
  <div id="retain_chart_line" v-if="isShowEcharts"></div>
</template>

组件加载时isShowEcharts为true，离开组件时改为false

以上代码为vue3.0中写法，且echarts部分未写出来（echarts的初始化、给值等）

---

查阅信息来源