由于项目中二次封装了echarts折线图,并且父组件通过选择不同时间,像后端请求不同数据,显示在折线图上,频繁切换会出现“There is a chart instance already initialized on the dom.”的警告,在网络上找办法后,解决了这个问题。

这个问题的出现在于,在一张表上渲染不同数据,其实dom已经存在了,但是我们在每次数据发生改变的时间都重新进行了一次渲染,导致出现警告

解决办法如下:

 //检测是否已经存在echarts实例,如果不存在,则不再去初始化
        let myChart = this.$echarts.getInstanceByDom(
          this.$refs[this.chartObj.type]
        );
        //如果为空 则正常进行渲染 反之 不再进行初始化 
        if (myChart == null) {
          myChart = this.$echarts.init(this.$refs[this.chartObj.type]);
        }
        
        myChart.setOption(this.option);
Logo

新一代开源开发者平台 GitCode,通过集成代码托管服务、代码仓库以及可信赖的开源组件库,让开发者可以在云端进行代码托管和开发。旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐