[Vue warn]: You may have an infinite update loop in watcher with express

已于 2023-12-04 16:54:56 修改
阅读量8.4k 收藏 3
点赞数 1
分类专栏： echarts vue项目开发 文章标签： vue.js echarts
于 2021-06-28 15:29:08 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_42103673/article/details/118304646
版权
本文分析了ECharts中因对option.data数组直接操作导致的无限更新循环问题。阐述了在watch监听下，对数组进行操作如倒置时引发的数据变动无限循环现象。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

echarts中option的data传数组，千万不要对数组进行操作，否则会出bug
you may have an infinite update loop in watcher with expression

错误分析：
首先chartSource在created生命周期中获取数据时也发生了变化,watch监听到后,重新渲染图标执行option操作,结果option中的data中的数组进行倒置了,

 data: data.xAxis.reverse()

那么watch监听的chartSource又发生变化,陷入了无限死循环中。

父组件中的传参：

子组件：

vue.runtime.esm.js:619 [Vue warn]: Duplicate keys detected: ‘/carsend‘. This may cause an update err
郭宝的博客
03-12 7070
背景： 在运行一个Vue项目时，出现了如下报错信息 vue.runtime.esm.js:619 [Vue warn]: Duplicate keys detected: '/carsend'. This may cause an update error. 解决办法： 错误提示说，检测到重复的密钥：“/carsend”。这可能会导致更新错误。 初步判断是路由路径重名了，那么根据这条线索，全局搜索/carsend 路由路径，查找相似路径，如下图所示，确实有两个相同的路由路径 那...
Vue 品牌列表自定义局部指令
mqingo的博客
01-07 567
  09品牌列表自定义局部指令.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scal
You may have an infinite update loop in watcher with expression “data“ 记一次报错
weixin_51352120的博客
03-21 2167
在一次父组件与子组件同时赋值的过程中，父组件初始化值，，子组件更新值后push进去，后页面报错You may have an infinite update loop in watcher with expression "data"，一直说有循环，单身并没有在watch那些冰没有循环，后来发现父组件跟子组件传的数组对象不一致，两个数组合并不了报的这个错，后来改成一样的就好了。
you may have an infinite update loop in watcher with expression
weixin_34307464的博客
03-07 7858
echarts中option的data传数组,千万不要对数组进行操作. 否则会出bug you may have an infinite update loop in watcher with expression 在带有表达式的观察程序中，可能有无限更新循环 为什么会出现这个bug呢? 分析如下: 错误的模式下:首先yKeyData在created生命周期中获取数据时也发生了变化,watch监听...
You may have an infinite update loop in a component render function.
最新发布
qq_45600165的博客
03-31 500
改变数组顺序，进而再次触发计算属性重新计算，如此反复，就形成了无限更新循环。，数组顺序改变后会触发计算属性重新计算，而重新计算又会再次调用。都会修改原数组的顺序。表明组件渲染函数里存在无限更新循环。计算属性中，每次调用。
You may have an infinite update loop in watcher with expression “columns“
Node.js安装报错 - npm -v 查看版本无效
08-15 1308
场景：iview 动态加载二级表头问题：中文含义：您可能在具有表达式“columns”的观察程序中有一个无限更新循环解决方法：方法1： 修改iview.js源码，亲测有效。（不建议）参考链接：https://blog.csdn.net/Qi_Si_Miao_Xiang/article/details/108826950方法2： 修改table组件代码。参考链接：https://blog.csdn.net/fanhailing/article/details/108465412。
(vue)Vue前台警告You may have an infinite update loop in watcher with expression
nyf_unknow的博客
08-16 4033
原因：循环的数组设置了全局（和我的特殊数组有关）
Vue前台警告You may have an infinite update loop in watcher with expression
符忻潼
06-11 1万+
今天在使用 Vue 开发过程中，前台控制台报了一个警告，经过一番百度，最终解决了问题，过程如下。 //控制台报错信息 vue.runtime.esm.js?2b0e:619 [Vue warn]: You may have an infinite update loop in watcher with expression "value" 控制台信息 控制台警告错误如图： 原因 报错是因为我要给 v-for 里边的一个数组类型的 item 排序，如果是普通的绑定，用计算属性是搞定的。然而，这个牵
若依分离版、vue报错：[Vue warn]: You may have an infinite update loop in a component render function.
weixin_46953697的博客
03-22 2468
问题描述： 页面运行正常，但刷新页面或新增文档后页面一直加载，后台报错： [Vue warn]: You may have an infinite update loop in a component render function. 根据网上查询的结果原因基本如下： 在for循环中我使用了函数，页面刷新或新增文档时间接修改了循环响应数据而且没有终止条。页面执行渲染时，又会改变状态，于是又渲染，迟迟不能生成真实节点，所以界面一直在转圈。 原代码： 数据： data() { return { //附件
Vue 源码解析（二）：依赖更新（Watcher对象，nextTick和更新队列）
Czuaphe的博客
05-25 925
第一篇，新建watcher对象时运行的getter函数，会调用data属性的get修饰器从而触发dep.depend()函数，完成了watcher与dep依赖的收集。让watcher和data建立了联系。那么这一次，让我们看一下依赖收集完成之后，是如何完成依赖更新的。 让我们从还是在initData() 方法里面的defineReactive()方法再次开始吧！ export function defineReactive (obj: Object, key: string, val: any, custo
【探究Vue原理】watcher的异步更新
杨光的博客
09-02 2339
目录开篇同步更新异步更新异步更新的源码分析flushSchedulerQueuequeueWatcher     开篇   之前的文章提到过，当用户修改了组件状态之后，dep会通知它所关联的watcher进行更新。更新过程分两种，一种是同步更新，另一种是异步更新。     同步更新   如果一个watcher实例的sync属性被置为true，则表明此watc...
【已解决】you may have an infinite update loop in watcher with expression “xxx“
程序边界
04-27 3595
不要在watch中对监听的值做修改操作，这个自不必多说，若是有deep: true去掉试试。。。水 简单记录，详细之后再补
解决iview 'You may have an infinite update loop in watcher with expression "columns"'
weixin_34319640的博客
11-02 3660
为什么80%的码农都做不了架构师？>>> ...
解决iview table组件报错问题You may have an infinite update loop in watcher with expression “columns“的两种方法
fanhailing的博客
09-08 8241
在使用table切换的时候出现报错： 代码是这样的： 表头是多级的。 查找了一下解决方案，多数是这一种： 方法一、更改iview.js源码： 改为： 但是这个仅限于本地使用，最好的是更改table组件，然后build生成iview.js和iview.min.js 更改table组件代码： src/components/table/table.vue中： 将： 画红框线位置代码改为： 然后重新build一下生成iview.js和iview.min.js。 方法二：不更改源码 在table外一层用v
报错解析 [Vue warn]: You may have an infinite update loop in a component render function.
热门推荐
pardon110的博客
11-07 7万+
vue操作一个很有意思的报错 [Vue warn]: You may have an infinite update loop in a component render function. 组件代码结构： <template> <span class=&a
You may have an infinite update loop in a component render function
猿妞儿
08-04 8591
}错误信息[Vue warn]: You may have an infinite update loop in a component render function. 过滤器例子
【bug】watch监听中循环数组，触发无限循环You may have an infinite update loop in watcher with expression
花椒和蕊的博客
08-25 2748
问题产生的原因是，后端返的数值字段为null，我用的是el-input-number，为null的时候默认值为0，也就是一点击就会出现个0，不想要这种效果，解决办法就是把null改为underiend。watch监听数组，循环数组，正常写业务逻辑，然后就遇到一个bug，在这个循环里代码重复了上百次，还会有报错，类似于这样。因为是在watch中直接修改的，代码的执行顺序没有控制好，才引起的报错。业务逻辑稍稍有些复杂，同一份数据源里要处理很多业务逻辑。总结最近遇到的bug，这个花的时间还挺长的。...
报错[Vue warn]: You may have an infinite update loop
qq_44185468的博客
11-27 897
报错[Vue warn]: You may have an infinite update loop in a component render function. 在开发中遇到这个问题，记录下。参照网上的方法解决： 源数据是经过sort()排序后的数据，正常操作却出现报错。 因为array.sort()改变了数组自身，导致了过滤器又一次被触发 。 解决方法： 在排序前先用 slice()方法浅...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值