出现 Error in callback for watcher “xx“: “TypeError: this.xx.forEach is not a function“ 解决方法

最新推荐文章于 2024-05-15 10:50:29 发布
最新推荐文章于 2024-05-15 10:50:29 发布
阅读量607 收藏
点赞数
分类专栏： BUG 文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47872288/article/details/136773266
版权
本文介绍了在Vue.js开发中遇到的`TypeError: this.xx.forEach is not a function`错误，分析了错误原因，可能是数据类型错误或数据未初始化。提供了解决方案，包括检查数据类型确保`infoWireRopeTableData`为数组，以及在异步数据加载完成后使用。并给出了实战中的代码修复示例。
摘要由CSDN通过智能技术生成

目录

1. 问题所示

编辑小程序的时候，浏览器终端出现如下Bug，如图所示

[Vue warn]: Error in callback for watcher "infoWireRopeTableData": "TypeError: this.infoWireRopeTableData.forEach is not a function"

found in


chunk-vendors.js:18552 
 [system] TypeError: this.infoWireRopeTableData.forEach is not a function
    at VueComponent.calculateUniqueWireTypesCount (VM187 B0U4:281:34)
    at VueComponent.handler (VM187 B0U4:253:38)
    at Watcher.run (chunk-vendors.js:7764:19)
    at flushSchedulerQueue (chunk-vendors.js:7506:13)
    at Array.<anonymous> (chunk-vendors.js:5135:12)
    at flushCallbacks (chunk-vendors.js:5061:14)

截图如下：

在这里插入图片描述

2. 原理分析

这个错误提示指出了在 Vue 监听器中，当 infoWireRopeTableData 发生变化时，尝试执行一个回调函数，但在

了解本专栏 订阅专栏 解锁全文 超级会员免费看
码农研究僧
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
订阅专栏
vue2/3 - echarts报错Error in callback for watcher “chartSource“: “Error: Initialize failed: invalid do
高级前端工程师
05-13 2582
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.“，解决办法，还是无效怎么办，浏览器控制台报错
Error in callback for watcher "data": "TypeError: children.indexOf is not a function" found in
qq_27628085的博客
02-27 4759
关于Error in callback for watcher “data”: "TypeError: data.indexOf is not a function"的错误说明 原因：显示需要数组包含对象的形式，每个对象是一行数据，拿到的数据格式不对。 错误例子： 从后台获取数据res.data,显示在树中。数据，且都为空。 报三个错，如下： 经过打印res.data之后...
Error in callback for watcher xx TypeError: Cannot read properties of undefined (reading ‘call‘)解决方案
qq_71214810的博客
03-01 1940
如图所示，控制台发现了以下报红：Error in callback for watcher xx TypeError: Cannot read properties of undefined (reading ‘call‘)
解决报错Error in callback for watcher “value“: “Value should be trueValue or falseValue.“
最新发布
qq_45094682的博客
05-15 392
来看一下报错原因，[Vue warn]: Error in callback for watcher “value”: “Value should be trueValue or falseValue.” 报错原因 来看一下是怎么找到错误的
Error in callback for watcher “value“: “TypeError: Cannot read property ‘repalce‘ of null“
qq_40668646的博客
12-18 1万+
vue空页面value空值问题 在页面后台中，输出了Error in callback for watcher “value”: "TypeError: Cannot read property ‘level’ of null"这样的错误，看了网上的一些博客，个人认为就是在input输入框中，当第一次输入，未保存数据之前，接口返回的数据基本都是null，所以可能是会报这个错误 解决办法 <u-form-item :label-position="labelPosition" label="出版物种类
Error in callback for watcher “options“: “TypeError:Cannot read properties of null (reading ‘level‘)
qq_45415736的博客
06-27 5861
原因是级联选择器el-cascader的属性options值在重新加载时赋值为空数组所导致。
vue监听报错Error in callback for watcher “option“: “TypeError: Cannot read property ‘apply‘ of undefined
github
07-08 2万+
项目场景： vue在子组件用watch监听器观测prop接收的父组件对象option， 问题描述： 浏览器发出了报错： [Vue warn]: Error in callback for watcher “option”: “TypeError: Cannot read property ‘apply’ of undefined” TypeError: Cannot read property ‘apply’ of undefined 以下是我的代码： watch: { // 只需要关注 opti
[Vue warn]: Error in callback for watcher “lss“: “TypeError: Cannot read properties of undefined
一个非常Cool的人
09-26 4229
[Vue warn]: Error in callback for watcher "lss": "TypeError: Cannot read properties of undefined
【cascader出现的报错】Error in callback for watcher “options“: “TypeError: Cannot read properties of null
m0_50125215的博客
02-14 6268
动态cascader级联选择器 动态cascader级联选择器，发现切换数据源的时候报错，网上看到这个文章完美解决https://blog.csdn.net/weixin_43043994/article/details/100303097 问题怎么出现的上面文章写的很清楚，解决方法就是重新加载组件。两个方法一个加v-if,一个加key <el-cascader :key="keyValue" //keyValue在data中定义，初始值为0 clearable :props=".
【bug】Error in callback for watcher “xxx“: “Cannot read propertiesof undefined (reading ‘indexOf‘)“
花椒和蕊的博客
06-13 3381
报错很多时候还是自己比较粗心主要是filterNode，筛选节点的方法里 ，名字和代码的字段写错了 从其他页面复制过来的时候忘记改了 报错说的是watcher监听有问题，就一直在watch里找问题，把筛选字段改成正确的之后就可以筛选了...
解决ant Design中this.props.form.validateFields未执行的问题
01-18
在使用ant Designd的 form 组件时发现点击提交方法中 this.props.form.validateFields((err, values) => {}) 部分未执行，也没有报错。 原因： 我使用了自定义校验 validator ，在自定义校验方法中有个错误，使用了...
array-foreach:Array.prototype.forEach polyfill
06-03
throw new TypeError(callback + ' is not a function'); } // 5. If thisArg was supplied, let T be thisArg; else let T be undefined. if (thisArg !== undefined) { T = thisArg; } // 6. Let k be 0. ...
JS中的forEach、$.each、map方法推荐
11-28
在JavaScript中，数组遍历是常见的操作，有多种方法可以实现这一目的，其中包括`forEach`、`$.each`（jQuery库中的方法）以及`map`。这些方法在处理数组时各有特点，适用于不同的场景。 首先，`forEach`是...
node.js中的fs.exists方法使用说明
01-20
`fs.exists()`方法是这个模块的一部分，它允许开发者检查指定路径的文件或目录是否存在。下面将详细介绍`fs.exists()`方法的使用、参数、工作原理以及其在实际应用中的示例。 ### 1. `fs.exists()`方法 `fs.exists...
node.js中的fs.readlink方法使用说明
01-02
方法说明： 以异步的方式读取链接。 语法： 代码如下: fs.readlink(path, [callback(err,linkString)]) 由于该方法属于fs模块，使用前需要引入fs模块（var fs= require(“fs”) ） 接收参数： path 路径 callback...
vue报错：Error in callback for watcher “options“: “TypeError: Cannot read propertie ‘level‘ of null
qq_33911541的博客
05-09 2769
vue报错：Error in callback for watcher "options": "TypeError: Cannot read propertie 'level' of null
报错：Error in callback for watcher “__propsSymbol__“: “Error: Need at least a key or a value or a labe
xiaoxiannvh的博客
08-21 3730
ant-design-vue，select组件未填写value值报错
[Vue warn]: Error in callback for watcher "xxxxxxxxx": "TypeError: Cannot set property 'name' of
热门推荐
Marswill
04-09 12万+
在vue中慎用箭头函数 以上标题其实是vue中的错误信息，但是由于标题的长度限制只能显示那么多。在此我将贴出完整的错误来分析。 文字错误描述： vue.esm.js?efeb:591 [Vue warn]: Error in callback for watcher "permissionGroup": "TypeError: Cannot set property ...
vue中watch的报错处理Error in callback for watcher “playing_list“:**
08-19 1万+
一般报这个错就是你watch监听中，对应的数据监听函数中出现了bug。 查找资料，都说是箭头函数引起的this指向问题，但是我的并没有写。 后来发现，我的是监听到数据变化就去刷新echarts，即重新绘制图表，但图表容器没有获取到，我直接绘制造成的。 watch:{ playing_list:function(newvalue,oldvalue){ if(this.dialogVisible_assess){//图表在弹框中，需要在弹框显示时重新绘制 if(t
Error in callback for watcher "value": "TypeError: this.forest.selectedNodeIds.forEach is not a function"
07-27
根据引用\[1\]中的错误信息，错误是在watcher的回调函数中出现的，具体错误是"TypeError: Cannot read properties of undefined (reading 'apply')"。根据引用\[2\]中的报错信息，可能是由于箭头函数引起的this指向问题。然而，根据引用\[3\]中的建议，你可以检查后台接口返回的数据是否为null，如果是null的话，需要将其改为''。所以，根据你提供的错误信息，可能是在watcher的回调函数中使用了forEach方法，但是this.forest.selectedNodeIds不是一个函数。你可以检查一下this.forest.selectedNodeIds的值是否正确，并确保它是一个数组。 #### 引用[.reference_title] - *1* [vue watch报错：Error in callback for watcher “xxx“: “TypeError: Cannot read properties of ...](https://blog.csdn.net/qq_45327886/article/details/126435710)[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^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [vue中watch的报错处理Error in callback for watcher “playing_list“:**](https://blog.csdn.net/sinat_36359516/article/details/119755097)[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^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [Error in callback for watcher “value“: “TypeError: Cannot read property ‘repalce‘ of null](https://blog.csdn.net/qq_40668646/article/details/111386945)[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^v91^control,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

码农研究僧

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

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

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

打赏作者

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

抵扣说明：

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

余额充值