微信小程序中使用echarts报错Cannot read property ‘setOption‘ of undefined

最近在开发小程序时遇到了报Cannot read property 'setOption' of undefined的问题,导致了在模拟器上能正常显示,在iOS上也可以正常显示,但是,倒了安卓手机就不能正常显示了

原因 就是在页面渲染时,数据还没有加载完毕

 报错提示如下图所示

解决方法

 在获取数据,处理数据的时候,加上一层定时器 ,就可以解决这个问题了

 原代码

        chartLine1.setOption({
          xAxis: {
              data: xAxisData.splice(0,7)
          }, 
          series:seriesData
        });

 解决后的代码

      setTimeout(() => {
        chartLine1.setOption({
          xAxis: {
              data: xAxisData.splice(0,7)
          }, 
          series:seriesData
        });
      }, 500);

此时,我们的echarts图标就可以正常显示了

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
这个错误通常发生在使用echarts库时,当尝试设置图表的选项时,echarts对象未被正确初始化。根据你提供的代码,这个错误可能是由于没有正确引入echarts库导致的。 在你的代码使用了`import echarts from 'echarts'`来引入echarts库。然而,根据的代码片段,你将echarts库导入为`import * as echarts from 'echarts'`。这两种导入方式是有区别的,可能是引发错误的原因之一。 你可以尝试按照的代码片段重新引入echarts库,使用`import * as echarts from 'echarts'`,然后再次运行你的代码。这样做应该可以解决`Cannot read properties of undefined (reading 'setOption')`的错误。 另,还有几个可能导致这个错误的原因。首先,确保你已正确安装了echarts库,并且版本号与你的代码兼容。其次,确保在组件挂载之前,即在`mounted`钩子函数调用`initEchart`方法之前,echarts库已经被正确加载。 尝试解决这些问题后,你应该能够成功设置echarts图表的选项,并避免出现上述错误。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [echarts 报错Cannot read properties of undefined (reading ‘coord‘)](https://blog.csdn.net/song_song0927/article/details/126179036)[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^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* *3* [引入echarts报错Cannot read properties of undefined (reading ‘init‘)](https://blog.csdn.net/m0_46114541/article/details/127771279)[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^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值