vue路由缓存keepAlive导致echarts图表100px偶现

项目里有一个页面用了路由缓存

// 路由文件
{
      path: '/test',
      name: 'test',
      component: () => import('@/views/index.vue'),
      meta: {
          keepAlive: true,
      },
},

// vue路由出口
<keep-alive>
    <router-view v-if="$route.meta.keepAlive"></router-view>
</keep-alive>
<router-view v-if="!$route.meta.keepAlive"></router-view>

有时候会缩到左上角去，查看大小是100px

解决办法：
如果是将echarts封装成一个vue组件，在activated钩子里加resize操作
 

// activated钩子执行resize()方法
activated() {
    this.$nextTick(() => {
        this.chart.resize(); // this.chart是echart实例
    });
},