如何让echarts图表自适应

方法一

let chart = echarts.init(this.$refs.refName);
...
window.addEventListener("resize", chart.resize);

方法二

使用resize-detector

• 1、下载resize-detector库

npm install resize-detector --save

• 2、引入工具类

import { addListener, removeListener } from "resize-detector"; // 监听图表变化

• 3、使用工具类

mounted() {
    this.chart = echarts.init(this.$refs.refName);
    addListener(this.$refs.refName, this.resize); //  添加图表监听
},
beforeDestroy() {
    removeListener(this.$refs.refName, this.resize); // 移除监听
    this.chart.dispose(); // 销毁图表实例
    this.chart = null;
},