echarts报错：Error in callback for watcher “chartSource“: “Error: Initialize failed: invalid dom.“

最新推荐文章于 2024-04-01 10:22:36 发布
原创 最新推荐文章于 2024-04-01 10:22:36 发布 · 4.1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#echarts #前端 #javascript

博客指出ECharts绘制图表报错，原因是数据还没请求回来就开始绘制，解决办法是添加if判断。

报错

 

原因：数据再还没请求回来开始绘制图表

修改添加if判断即可：

vue2/3 - echarts报错Error in callback for watcher “chartSource“: “Error: Initialize failed: invalid do
高级前端工程师
05-13 3114
vue.js，vue2，vue3，echarts，Echarts图表插件，vue3+charts报错，chartSource，为什么会报错，图表渲染失败，加了if判断依旧报错，echarts chartSource，回调观察程序“chartSource”时出错：“错误：初始化失败：dom无效。”，Error in callback for watcher “chartSource“: “Error: Initialize failed: invalid dom.“，解决办法，还是无效怎么办，浏览器控制台报错
B站(云e办)SpringBoot实战练习的Sql文件、前端Vue源码、后端springboot源码
m0_54849806的博客
02-26 1303
B站SpringBoot实战练习的资源 1. Sql下载地址： 2. 前端源码下载地址： 3. 后端源码下载地址 资源来源——网络资源搜索！github开源项目练习！ 1. Sql下载地址： 链接：点击我下载sql文件 提取码：yeb7 2. 前端源码下载地址： 链接：点我下载前端代码 提取码：yeb7 3. 后端源码下载地址 链接：点我下载前端代码 提取码：yeb7 如需在线api文档请联系 qq： 87395809, 表明来意 总结 写到这里也结束了，在文章最后放上一个小小的福利，以下为小编自
Error in callback for immediate watcher “data“ “TypeError Cannot read properties of null
jiey0407的博客
03-03 9395
今天发现了一个错误提示，虽不影响数据输出，但终究是一个错误，我们就找找原因把他解决。 vue.runtime.esm.js2b0e:619 [Vue warn]: Error in callback for immediate watcher “data”: “TypeError: Cannot read properties of null (reading ‘reduce’)” 翻译结果： 立即观察者“数据”的回调错误：“类型错误：无法读取 null 的属性 经过筛查，我们发现去掉row-key="i
Error in callback for immediate watcher “chartsData“: “Error: Initialize failed: invalid dom.“
最新发布
2301_80868127的博客
04-01 1952
在封装中推荐大家使用监听器来实现触发更新，这样会使你的效果最佳，也最保险，不会出现dom未生成的情况，我们通常会把一些可变的值传递给子组件，比如data，在data初始化还是空的时候我们就在编译父组件时进行了传递，子组件监听初次执行，但是不显示因为是空数据，当我们函数运行完，拿到了后台数据进行再次赋值，子组件的props同时更新，被监听到后就会再次触发渲染函数，echarts图表就正常显示了。函数在初始化时延时调用；
使用echarts报错Error: Initialize failed: invalid dom. 解决方法及详解
X_Flandre的博客
07-16 7070
错误案例一 父组件中： <echartsLine :id="numLine" v-if="numData" :lineData="numData"></echartsLine> 子组件中： <div :id="id" :style="`width:${width};height:${height}`"></div> 解决办法 :父组件传id必须在双引号内加单引号,让值成为string类型,子组件才能正确接收 报错信息:![在这里插入图片描述](http
Error in callback for watcher "rePromisePercent": "Error: Initialize failed: invalid dom."
07-27
- *2* *3* [使用echarts报错Error: Initialize failed: invalid dom. 解决方法及详解](https://blog.csdn.net/X_Flandre/article/details/118809014)[target="_blank" data-report-click={"spm":"1018.2226.3001....
vue中watch的用法总结以及报错处理Error in callback for watcher "checkList"
weixin_34153893的博客
04-20 1万+
　　首先确认 watch是一个对象，一定要当成对象来用。 对象就有键，有值。 　　键：就是你要监控的那个家伙，比如说$route，这个就是要监控路由的变化，或者是data中的某个变量。 　　值可以是函数：就是当你监控的家伙变化时，需要执行的函数，这个函数有两个形参，第一个是当前值，第二个是变化后的值。 　　值也可以是函数名：不过这个函数名要用单引号来包裹。 　　第三种情况厉害了。 值是包括...
vue.runtime.esm.js:620 [Vue warn]: Error in created hook: “TypeError: this.initDeptTree(...) is not
qubes的专栏
02-20 1601
方法1：每个语句后面加分号，但是format会自动删掉非必要分号，保留最后一条语句的分号。当前方法initDeptTree和下一个语句拼接到了一起。控制台报错 死活说，不认识这个方法。方法2：修改后面的写法。
kubelet源码学习（一）：kubelet工作原理、kubelet启动过程
hxt的博客
12-24 2679
本文基于Kubernetes v1.22.4版本进行源码学习。
Error in callback for watcher “options“: “TypeError:Cannot read properties of null (reading ‘level‘)
qq_45415736的博客
06-27 7923
原因是级联选择器el-cascader的属性options值在重新加载时赋值为空数组所导致。
控制台报错：Error in callback for watcher “data“: “TypeError: data.indexOf is not a function
张张张的博客
11-15 1万+
从后台获取数据的result数据，通过打印result.data,发现result.data是个对象，而你写的表格需要是数组，所以报错了 解决方法： 1.让后台修改返回的格式 2.定义一个新的空数组，直接在空数组push这个对象即可。即arr.push(result.data)， 这样就成功显示数据了。 ...
Vue中使用echarts弹窗报错：Error in callback for watcher “visible“: TypeError: Cannot read propert ‘xx‘ of...
KangMino的博客
02-21 5412
前言： 相关代码https://blog.csdn.net/KangMino/article/details/123015094 问题： 在写弹窗watch部分时，原本是这样写的 watch: { visible(val) { this.showDialog = val if (val === true) { this.fetchDetail() } }, showDialog(val) { this.$emi
[Vue warn] Error in callback for immediate watcher “data“ “TypeError Cannot read property ‘reduce
embelfe_segge的博客
03-09 1394
今天发现了一个报错提示，虽然不影响使用但还是看看怎么解决吧 [Vue warn]: Error in callback for immediate watcher “data”: “TypeError: Cannot read property ‘reduce’ of null” vue.runtime.esm.js:1888 TypeError: Cannot read property ‘reduce’ of null 一开始以为是不是缺少reduce字段，后面全局搜都没看到有地方用到了reduce，
[Vue warn]: Error in callback for immediate watcher “formInline.projectSups“
qq_45791799的博客
12-04 6285
继上次监听了formInline里面的projectSup字段后，发现出了一个bug， Error in callback for immediate watcher “formInline.projectSups”: “TypeError: Cannot read property ‘filter’ of undefined” 大概可以知道是在watcher监听的时候报的错，但其实不影响使用，但这个飘红看着真的很难受。正当我百思不得其解的时候，发现了这个 所以刚开始进页面的时候会先执行watch，此
第十四篇：Error in callback for watcher “options“: “TypeError: Cannot read properties of null
maliyao4233的博客
08-11 1942
是因为我在调用编辑接口的时候传参数的时候，直接用delete 删掉了这个参数，因为编辑接口不需要这个字段所以我当时直接删掉了，delete慎用删掉的话就是直接把这个字段删掉了可能会有别的影响，所以我拆分出来传对应的参数就不报错了。
解决Vue报错Error in callback for immediate watcher “height“: “TypeError: Cannot read properties of
热门推荐
m0_59360516的博客
11-23 1万+
vue是先拿到data里面的数据，再去执行created和mounted里面的函数，而我把height赋值为空了，当vue拿到data里面的数据时，为空，所以就会报错，后面再执行mounted里面的高度计算方法时，也只是给height赋值。优化后的方法，两步就搞定了，不需要在data里面声明了，把高度计算的函数放在computed计算属性里面就解决了，也解决了控制台报错的问题。这个错误报得莫名其妙，既没告诉你具体位置，也没告诉你是哪里出错，页面和数据都能正常显示，于是我找啊找啊，终于知道是哪里的问题了。
vue -- 封装eacharts组件, watch监听报错
King Saj
10-30 1847
报错信息: Error in callback for immediate watcher 错误提示很明显 immediate 错误, 删除 immediate: true 代码即可 <template> <div :class="className" :style="{height:height,width:width}" /> </template> <script> import echarts from "echarts"; req
[VUE WARN]: ERROR IN CALLBACK FOR WATCHER “data“，监听数据时报错
weixin_48986139的博客
09-30 7980
关于报错 [VUE WARN]: ERROR IN CALLBACK FOR WATCHER “data”，“TypeError: Cannot read properties of null (reading ‘xxxxxxx’)” 含义 这个错误是你监听data时方法里的值为null，造成调用xxxxxxx时导致报错, 解决办法 一般可以在调用方法前，确保它存在，例如下图： @Watch('data') 你的监听函数的名(newVal){ this.$nextTick(()=>{
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值