问题：页面的echart图表在浏览器缩放屏幕比例时无法随着屏幕的比例自动改变大小

解决方式：

可以通过监听窗口的 resize 事件，并在事件回调函数中重新调整图表的大小。

<template><div ref="chartContainer" style="width: 100%; height: 400px;"></div>
</template><script>
import * as echarts from 'echarts';export default {name: 'MyComponent',data() {return {chart: null,};},mounted() {//初始化图表this.initChart();//监听窗口的 resize 事件，并在事件回调函数中重新调整图表的大小。window.addEventListener('resize', this.resizeChart);},beforeDestroy() {//销毁window.removeEventListener('resize', this.resizeChart);},methods: {initChart() {this.chart = echarts.init(this.$refs.chartContainer);// 设置图表配置项和数据...},resizeChart() {//判断图例是否存在if (this.chart) {//图例存在调用图表的重置this.chart.resize();}},},
};
</script>