【ECharts】报错集合

目录

图表不展示

报错:export 'default' (imported as 'echarts') was not found in 'echarts'。

报错:There is a chart instance already initialized on the dom。


图表不展示

一定要设置高宽。

 <div id="chart style="width:500px; height:500px" ></div>

报错:export 'default' (imported as 'echarts') was not found in 'echarts'。

当前版本

解决方案

npm install echarts@4.9.0

报错:There is a chart instance already initialized on the dom。

dom上已经初始化了一个实例,并且如果你图表中定义了点击方法,多次覆盖之后,点击方法会触发多次。更新页面重复加载这个图表实例时就会出现这类警告。

var mychart

if (mychart != null && myChart != "" && myChart != undefined) {
  myChart.dispose()
}

myChart = echarts.init(document.getElementById('container'));
let myChart = this.$echarts.getInstanceByDom(this.$refs[this.chart.type]);
if (myChart == null) {
    myChart = this.$echarts.init(this.$refs[this.chart.type]);
}
myChart.setOption(option);

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
在使用Vue和Echarts"TypeError: Cannot read property 'getAttribute' of null/undefined"。这个误可能有几个原因。首先,当你在created钩子中调用Echarts的渲染代码时,可能会发生此误,因为此时DOM元素还没有被完全渲染。解决方法是在mounted钩子中调用渲染代码,或者在created钩子中使用this.$nextTick()方法包裹渲染代码。 另外,如果你在使用Echarts之前没有正确引入Echarts库或者Echarts实例化的DOM元素不存在,也会导致此误。确保你已经正确引入Echarts库,并且确保在调用Echarts渲染之前DOM元素已经存在。 此外,还有可能是因为在使用dialog时,没有正确实例化Echarts实例,导致此误。在dialog的show方法中,你可以使用this.$nextTick()方法来确保在实例化Echarts之前DOM元素已经完全渲染。 总结起来,解决"TypeError: Cannot read property 'getAttribute' of null/undefined"误的方法有: 1. 在mounted钩子中调用Echarts渲染代码。 2. 在created钩子中使用this.$nextTick()方法包裹Echarts渲染代码。 3. 确保正确引入Echarts库,并且确保在调用Echarts渲染之前DOM元素已经存在。 4. 在使用dialog时,使用this.$nextTick()方法确保在实例化Echarts之前DOM元素已经完全渲染。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [VUE引入EchartsUncaught TypeError: Cannot read property ‘getAttribute‘ of null](https://blog.csdn.net/Kne982895961/article/details/121146898)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [76.解决Vue引用echartsCannot read property ‘getAttribute‘ of undefined](https://blog.csdn.net/Annexiaobin/article/details/122086224)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

宾果的救星

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值