vue——错误记录：You may have an infinite update loop in a component render function.

最新推荐文章于 2024-03-18 22:04:15 发布
最新推荐文章于 2024-03-18 22:04:15 发布
阅读量2w 收藏 1
点赞数 2
分类专栏： vue_study 文章标签： vue javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42257997/article/details/107536700
版权

想法是将不同页面动态存储在localStorage的数组渲染到另一页面

然后出错~~~~~~~~~~~~~~~~~~尽管知道怎么回事，就是v-for循环中，不能对循环的数组里的对象的数组进行操作，也就是不能对datas的值改变，但还是懵

 

后来我仔细用我笨拙的脑袋抠脚一想，想了一个办法，虽然还是报错但能成功渲染出来。。。

我得继续抠脚想想怎么把错误干掉，记录一下~~~

解决了！！！！！！！！

我真是蠢得要死要死！！！

我以为问题出在datas，以为动态地改变了datas出错，其实并不是这样的！

 

如果需要调用的方法不是像我这种比较简单的判断，可以看看这一篇，我就是从这里得到启发的！

https://blog.csdn.net/aa59609911/article/details/105238253?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-4.channel_param

中原猪精
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
Vue infinite update loop的问题解决
12-01
一个尤大大曾回复过的问题 vue warn : You may have an infinite update loop in a component render function 最近再写一个数组渲染时，源数据是拿到的数组经过排序后的数组，正常运行却出现爆红： 报红代码： computed: { ...mapState({ fromNames (state) { let fromNames = state.quote.fromNames; return fromNames.sort((a, b) => b.isBind - a.isBind);; }, }), },
vue动态属性不更新和You may have an infinite update loop in a component的解决方案
weixin_40466351的博客
03-01 1020
1、实现效果 需求:显示每种类型的每种错误类型的失败数据 问题1：数据更新了，但是视图不渲染 解决方案：使用$set this.$set(this.dataObj, prop, {}); this.$set(this.dataObj[prop], "activeData", []); this.$set(this.dataObj[prop], "activeName", ""); // this.dataObj[prop] = {}; /
猫头虎分享已解决Bug || Error: [Vue warn]: You may have an infinite update loop in a component render functio
最新发布
从前端设计到后端实现，从云技术到人工智能，这里分享最新的技术见解和实践经验。一起学习，一起进步！
03-18 758
大家好，我是猫头虎博主，今天我们要聊的是前端技术领域的一个常见Bug——Vue组件渲染函数中的无限更新循环错误。这个问题可能会让不少前端开发者感到头疼，不仅影响用户体验，还可能导致页面崩溃。在本文中，我们将深入探讨这个问题的原因、详细的解决方法和步骤，还会提供操作命令和代码案例演示，帮助大家彻底解决这个棘手的问题。🐱🐅Vue.js是一个构建用户界面的渐进式框架。在Vue中，组件的渲染过程是响应式的。当组件的状态（响应式数据）发生变化时，Vue会重新渲染组件。
vue You may have an infinite update loop in a component render function 报错的原因
每文的博客
11-23 1万+
今天做东西遇到很多问题，现在都快回忆不起来了，印象特别深刻的就是： vue You may have an infinite update loop in a component render function 通过百度，看文章，才明白： 在v-for当中，如果在循环当中调用了方法，而在方法当中去修改data中属性的值，就会导致这样的问题。 至于为何会如此，恐怖要去研究v-for指令和渲...
报错 You may have an infinite update loop in a component render function.
n_j_q的博客
08-31 1348
You may have an infinite update loop in a component render function.
You may have an infinite update loop in a component render function.组件渲染函数中可能有一个无限更新循环。
Y2835742027的博客
12-06 3182
You may have an infinite update loop in a component render function.
vue使用sort排序时报死循环错误:you may have an infinite update loop in a component render function
越是安静内敛的人，越容易生不惊人死不休
04-20 1136
vue - vue使用sort排序时报死循环错误:you may have an infinite update loop in a component render function
You may have an infinite update loop in a component render function.
热门推荐
潇湘子的博客
08-12 2万+
问题：You may have an infinite update loop in a component render function. 在组件渲染函数中你可能有一个无限更新的循环 这就导致页面一直在加载无限循环下去，没有终止，卡死 在vue的data方法中： data() { // 定义响应式变量 isExecuteFlag: false } <el-table-column prop="" label="操作" width="190" align="center"> &
You may have an infinite update loop in a component render function 问题解决
qq_37683424的博客
01-15 1220
You may have an infinite update loop in a component render function 这个问题，一般是在循环中不停修改data中变量，原因是vue中的data()中的属性值是受监听 ，触发计算属性进行计算，出现死循环 indexCurrent 值我是放data，就会出现这个问题，解决方法indexCurrent定义为全局 ...
[Vue warn]: You may have an infinite update loop in a component render function
qq_45796592的博客
05-12 7187
解决bug的方法
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
主要介绍了Vue 报错TypeError: this.$set is not a function 的解决方法，分享给大家，需要的朋友们下面随着小编来一起学习学习吧
详解Vue.js搭建路由报错 router.map is not a function
10-19
主要介绍了详解Vue.js搭建路由报错 router.map is not a function，非常具有实用价值，需要的朋友可以参考下
Vue循环问题-[Vue warn]: You may have an infinite update loop in a component render function-解决-在线案例
JackieDYH的博客
04-28 4614
[Vue warn]: You may have an infinite update loop in a component render function.在组件呈现函数中可能有一个无限更新循环 在循环过程中，修改到了循环对象，从而引发了无限循环，此时vue会发出警告，但并没有真正产生死循环。 你的确导致了一个无限循环， 因为array.sort()改变了数组自身，导致了过滤器又一次被触发。确保在副本上对数组排序： return value.slice().sort(...) 分析 ...
vue You may have an infinite update loop in a component render function 报错
fighter22的博客
05-07 481
与vue的页面渲染机制有关，错写了v-if=“XXX = ‘XXX’ ”，少了一个=，导致页面渲染出现问题。 在我写的循环中有对判断条件赋值，所以出现问题。 具体原因还未深究...... ...
You may have an infinite update loop in a component
hanjingjun123的博客
10-08 1059
You may have an infinite update loop in a component 学习借鉴自：https://segmentfault.com/a/1190000011156865 例如这样一个组件，它里面是用 :checked + 实现的一组按钮。它有以下功能： 为了能够分组，需要设置它们的 name 属性 为了能够用 控制 ，需要给 设置 id 按钮可以被删除 于是...
vue 一个超级简单的无缝图片滚动
qq_42257997的博客
11-11 3348
由于项目需要，我的滚动不设置自动滚动，不设置定时，添加定时也不难，在调用滚动函数的时候加个定时就ok 项目大概如下：点击左右箭头实现无缝滚动 设计思路：点击左箭头，数组首元素添加到最后一个并删除；点击右箭头，数组最后尾元素添加到第一个并删除 代码如下 template部分 script部分 clickLeft(){ let direction = 'left' this.scrollImg(direction) }, clickRight(){ le
百度小程序登录获取用户信息过程（笔记）
qq_42257997的博客
10-26 3033
百度小程序的登录流程与微信小程序相同，接下来捋一捋整个过程 1.login获取code，前端获取到code交给后端，后端处理拿到session_key 后端用的nodejs框架thinkjs写的，获取session_key接口为getSecssionKeyAction()，nodejs的其他框架也可以这样 const Base = require('../base.js'); const axios = require('axios'); module.exports = class e.
vue开发中遇到了You may have an infinite update loop in a component render function.报错，如何解决
11-03
当在Vue组件的渲染函数中出现无限更新循环时，会出现"You may have an infinite update loop in a component render function"的报错。这个问题通常是由于在渲染函数中修改了data中的数据，导致组件重新渲染，又触发了渲染函数，从而导致死循环。解决这个问题的方法有以下几种： 1.使用计算属性代替直接在渲染函数中使用data中的数据，这样可以避免在渲染函数中修改data中的数据。 2.使用watch监听data中的数据变化，当数据变化时，执行相应的操作，而不是在渲染函数中直接修改数据。 3.使用v-if或v-show等指令控制组件的显示和隐藏，而不是在渲染函数中直接修改数据。 4.使用Vue.nextTick()方法，将需要修改的数据放在nextTick()的回调函数中执行，这样可以确保数据已经更新完毕再进行操作，避免出现死循环。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值