多个图表window.onresize，只有一个图表自适应生效

问题描述

**多个ehart图表在一个vue组件中,每个图表函数如下：

 const initSupplierBusinessAmountView = () => {
  const BusinessAmountViewChart = echarts.init(oChart, null, { renderer: 'svg' }); 
        // 指定图表的配置项和数据
        const option = {
          series: businessCountList.value.map((i, idx) => ({
            name: i.businessName,
            type: 'bar',
            itemStyle: {
              color: colorList.value[idx],
              borderRadius: 100,
              borderWidth: 1,
              borderColor: 'transparent',
            },
            data: i.yAxisList,
            barWidth: 30,
          })),
          grid: {
            top: '5%', 
            left: '1%',
            right: '1%',
            bottom: '2%', 
            containLabel: true,
          },
        };
        BusinessAmountViewChart.setOption(option);
        window.onresize = () => {
          BusinessAmountViewChart.resize();
        }
 }
   const initData = () => {
      initSupplierBusinessAmountView();
    };

多次使用window.onresize，只有一个图表响应式有效

 window.onresize = () => {
         BusinessAmountViewChart.resize();
  }

解决方案

修改onresize的绑定方式

  window.addEventListener('resize', () => {
         PerformanceRankViewChart.resize();
   });