有关在vue同一个页面调用多个echarts图表warning

  • Post author:
  • Post category:vue


data(){
	return {
		// data区域创建一个空对象 里面对应要init的echarts对象
		 echartsObj: {
	        saleBar: null,
	        numBar: null,
	        onlineBar: null,
	        rateBar: null,
	        moneyBar: null
      },
	}
},
methods: {
	   // 图表销毁
    disposeChart (obj) {
      for (const item in obj) {
        if (obj[item] !== null && obj[item] !== '' && obj[item] !== undefined) {
          obj[item].dispose()
        }
      }
    },
    // 展示图表
    showEcharts(){
    	 this.$nextTick(() => {
    	 	// 在重新渲染图表之前判断是否对图表销毁
	        this.disposeChart(this.soloEchartsObj)
	       this.initEcharts()
      })
    },
    // 生成echarts图表
    initEcharts(){
		 const myChart = echarts.init(document.querySelector('.saleCharts'))
		 // 将echarts对象赋给data区域的对象
      	this.echartsObj.saleBar = myChart
	},
    
}



版权声明:本文为m0_45868673原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。