出错原因和解决方案:echarts Error:`setOption` should not be called during main process

出错原因

  • 其实归根到底就是数据渲染没渲上去echarts已经初始化了,但由于没数据,就报这个错。
  • 还有一种是数据遗留,比如有多个用户数据的echarts图,在切换数据的时候没有及时清空前一个人的数据,就会出这个错。
  • 注意:如果这两个都不是,检查一下数据是不是都在(有后端的看看接口返回的是不是空),如果是空那你就要做个判断了。因为一定是某个数据没有,才会出这个错。(排查思路已经放这了,什么问题自己去debug)

解决方案(针对上面两种错)

  • 第一种方法,用clear() -> 这是echarts里自带的api,意在清空画布。
// echartsBox是绑定的echarts盒子
 echartsBox.clear();
 echartsBox.setOption(option)
  • 第二种方法,在初始的方法(setOption)外面套个setTimeout,延时加载数据。可以放在mounted里,也可以放在别的地方,具体看需求了。(ps:可以试试一二种方法的组合拳…先清空数据然后请求加载)
setTimeout(() => {
	this.setOption();
    this.echartsBox.setOption(this.option);
}, 500)
  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值