同一个echarts在页面中多次使用，自适应问题解决

最近需要些一些关于echarts 图表的内容，遇到了问题，比如我同一个柱状图bar-chart，在同一个页面中多次使用，发现只有最后一个根据页面的变化自适应了，于是各种找问题各种百度，最后找到了解决办法，代码如下：

 <div class="chart-box mb-16">
            <div :id="`rankingChart${ind}`" style="height:600px"></div>
          </div>
          <script>
          export default{
          data(){
          	return{
        			echartsOption:{}//echarts 数据对象
        			}
        	  },
          methods:{
			initChart(dataobj,chartid,callback){
				//dataobj为接口返回的数组对象，chartId 为div id,callback回调函数，这个最关键
				 this.stockChart = this.$echarts.init(
       			 document.getElementById(chartId) );
     			 this.stockChart.setOption(this.echartsOption);
    			callback;// callback放在这里
			}，
   		 }
			}
			
          </script>

自适应函数代码

		 resizeChart(id){
     		 let $this = this;
      		window.addEventListener('resize',()=>{
       		 $this.$echarts.init(document.getElementById(id)).resize()
    	  })
  	  },

最后这么写，有几个echarts就调用几次，下面这段代码最关键：

    this.initChart(this.chartDataOne,'rankingChart0',this.resizeChart('rankingChart0')); ```