vue2 echarts resize()

在 Vue.js 2.x 中，可以使用 `resize()` 方法来重新调整 Echarts 图表的大小。下面是一个示例：

首先，确保你已经安装了 `echarts` 和 `vue-echarts` 包。然后，在需要使用 Echarts 的组件中，你可以按照以下步骤进行操作：

1. 在组件的 `data` 中定义一个变量来保存 Echarts 实例，例如 `chart`。

2. 在组件的 `mounted()` 钩子函数中，创建 Echarts 实例，并将其保存到 `chart` 变量中。

import echarts from 'echarts';

export default {
  data() {
    return {
      chart: null
    };
  },
  mounted() {
    // 创建 Echarts 实例
    this.chart = echarts.init(this.$refs.chartContainer);

    // 初始化图表配置
    // ...

    // 调整图表大小
    this.resizeChart();
  },
  methods: {
    resizeChart() {
      // 调整图表大小
      this.chart.resize();
    }
  },
  beforeDestroy() {
    // 销毁图表实例
    this.chart.dispose();
  }
};

3. 在模板中使用 `ref` 属性来引用图表容器，并在图表容器上添加 `@resize` 事件监听器，以便在容器大小改变时触发 `resizeChart` 方法。

<template>
  <div ref="chartContainer" @resize="resizeChart"></div>
</template>

这样，当组件加载完成时，会自动创建并初始化 Echarts 实例，并将图表大小调整为容器的大小。当容器大小改变时，`resizeChart` 方法会被调用，重新调整图表的大小。在组件销毁之前，记得销毁图表实例，以释放资源。

希望这个示例能帮助到你！如果有任何问题，请随时向我提问。