v-for产生 You may have an infinite update loop in a component render function

参考文章: 报错解析 [Vue warn]: You may have an infinite update loop in a component render function.
另外一个解决方法
例如:
MyList 是一个数组,我希望将排序后的结果返回进行for循环,因此设计了一个myMethon函数

<div v-for="item in myMethod(MyList,'id')">

函数如下,根据id返回

myMethod (list, field) {
	if (list.length && list.length > 0) {
	  return list.sort((a, b) => a[field].localeCompare(b[field]))
	}
	return list
}

上述例子会造成You may have an infinite update loop in a component render function
原因是在 MyList是经过vue处理过后的对象,里面有一些get,set 监听字段变化,用于更新视图的数据。

从debug视图可以很明显的知道这个是一个被vue处理过的对象,用的是观察者模式。

解决方法很简单

myMethod(MyList,'id') 
换成下面这个,调用MyList的toString,然后再反解析成Json对象
myMethod(JSON.parse(JSON.stringify(MyList)),'id')

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/924055.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

中国前首富胡志标亮相创客匠人盛会,点燃创始人 IP 新思维火花

创客匠人正式官宣&#xff01;原爱多VCD创始人、中国前首富胡志标受邀出席创客匠人5000人“全球创始人IP领袖高峰论坛”&#xff0c;将与我们携手共赴这场商业巅峰盛宴。 由创客匠人打造的“全球创始人IP领袖高峰论坛”将在2024年12月26日-28日在厦门市国际博览会议中心如期举…

qsort函数详解+代码展示

文章目录 概要系列文章目录前言(1) 定义(2) 使用&#xff08;举例子 上代码&#xff09;1、定义数组&#xff1a;2、定义比较函数&#xff1a;3、调用 qsort&#xff1a;4、输出结果&#xff1a; (3) 注意事项 小结 概要 本篇博客将详细地介绍qsort排序函数&#xff0c;&#x…

CSS之3D转换

三维坐标系 三维坐标系其实就是指立体空间&#xff0c;立体空间是由3个轴共同组成的。 x轴:水平向右注意:x右边是正值&#xff0c;左边是负值 y轴:垂直向下注意:y下面是正值&#xff0c;上面是负值 z轴:垂直屏幕注意:往外面是正值&#xff0c;往里面是负值 3D移动 translat…

2024年nvm保姆级安装教程

需求&#xff1a;当前我的nodejs的版本是6.14.10&#xff0c;想切换为更高的版本。故使用nvm工具来实现不同node版本之间的切换 目录 一、删除node二、nvm安装三、配置nvm镜像四、安装所需要的nodejs版本nvm常用命令 一、删除node 第一步&#xff1a;首先在控制面板删除node.j…

Python编程语言中的优雅艺术:数值分隔符的巧妙运用

在Python编程的世界里&#xff0c;有许多精巧的设计让代码更优雅、更易读。今天要分享的是一个看似简单却能大幅提升代码可读性的特性 —— 数值分隔符。这个特性从Python 3.6版本开始引入&#xff0c;它用一种极其优雅的方式解决了大数值表示的难题。 数值分隔符的本质与应用…

JS-06-事件监听

事件监听 当鼠标进行操作的时候能够对网页页面进行操作。 事件绑定 常见事件 onload: 当某个页面或者元素加载完成之后执行指定的代码块 onclick:鼠标单机的时候就执行指定的代码块 onblur\onfocus:鼠标点击的时候光标在的地方就是获得焦点否则失去焦点 onkeydown:绑定键盘…

Adaboost集成学习 | Python实现基于NuSVR-Adaboost多输入单输出回归预测

目录 效果一览基本介绍程序设计参考资料效果一览 基本介绍 基于NuSVR-Adaboost多输入单输出回归预测python代码 NuSVR是一种支持向量回归(SVR)算法的变体,用于解决回归问题。SVR是一种监督学习方法,它用于预测连续目标变量,而不是分类标签。NuSVR在SVR的基础上引入了一个…

数据结构C语言描述5(图文结合)--队列,数组、链式、优先队列的实现

前言 这个专栏将会用纯C实现常用的数据结构和简单的算法&#xff1b;有C基础即可跟着学习&#xff0c;代码均可运行&#xff1b;准备考研的也可跟着写&#xff0c;个人感觉&#xff0c;如果时间充裕&#xff0c;手写一遍比看书、刷题管用很多&#xff0c;这也是本人采用纯C语言…

ADS9-V2EBZ 评估板

ADS9-V2EBZ 评估板 概览 优势和特点 Xilinx Kintex Ultrascale XCKU15P-2FFVE1517E FPGA。 1 个 FMC 连接器。 20 个 28 Gbps 收发器&#xff0c;由一 (1) 个 FMC 连接器提供支持 HMC DRAM 简单 USB 3.0 端口接口。 随附两张微型 SD 卡&#xff0c;“TRX”用于 ADRV9026 评估…

深入探讨 Redis 持久化机制:原理、配置与优化策略

文章目录 一、引言二、Redis持久化概述三、RDB&#xff08;Redis DataBase&#xff09;持久化1、RDB概念与工作原理2、RDB的配置选项3、RDB优化配置项4、RDB的优势与劣势 三、AOF&#xff08;Append-Only File&#xff09;持久化1、AOF概念与工作原理2、AOF的三种写回策略3、Re…

【回文数组——另类递推】

题目 代码 #include <bits/stdc.h> using namespace std; using ll long long; const int N 1e510; int a[N], b[N]; int main() {int n;cin >> n;for(int i 1; i < n; i)cin >> a[i];for(int i 1; i < n / 2; i)b[i] a[i] - a[n1-i];ll ans 0;…

scala统计词频

package test23import java.io.PrintWriter import scala.io.Source object test {def main(args: Array[String]): Unit {//从文件1.txt中&#xff0c;读取内容val content Source.fromFile("1.txt").mkStringprintln(content)//把字符串中的每个单词&#xff0c;…

数据结构——排序算法第二幕(交换排序:冒泡排序、快速排序(三种版本) 归并排序:归并排序(分治))超详细!!!!

文章目录 前言一、交换排序1.1 冒泡排序1.2 快速排序1.2.1 hoare版本 快排1.2.2 挖坑法 快排1.2.3 lomuto前后指针 快排 二、归并排序总结 前言 继上篇学习了排序的前面两个部分:直接插入排序和选择排序 今天我们来学习排序中常用的交换排序以及非常稳定的归并排序 快排可是有多…

Android基本概念及控件

Android是Google公司基于Linux平台开发的主要应用于智能手机及平板电脑的操作系统。 ART模式与Dalvik模式最大的不同在于:在启用ART模式后&#xff0c;系统在安装应用程序的时候会进行一次预编译&#xff0c;并先将代码转换为机器语言存储在本地,这样在运行程序时就不会每次都…

【JavaEE初阶 — 网络编程】Socket 套接字 & UDP数据报套接字编程

1. Socket套接字 1.1 概念 Socket 套接字&#xff0c;是由系统提供用于网络通信的技术&#xff0c;是基于TCP / IP协议的网络通信的基本操作单元。基于 Socket 套接字的网络程序开发就是网络编程。 1.2 分类 Socket套接字主要针对传输层协议划分为如下三类&#x…

Leecode刷题C语言之交替组②

执行结果:通过 执行用时和内存消耗如下&#xff1a; 代码如下&#xff1a; int numberOfAlternatingGroups(int* colors, int colorsSize, int k) {int res 0, cnt 1;for (int i -k 2; i < colorsSize; i) {if (colors[(i colorsSize) % colorsSize] ! colors[(i - …

科技惊艳:RFID技术引领被装物联网信息化革新

被装物联网信息化监控系统是一项错综复杂却成效斐然的解决方案&#xff0c;它巧妙地将物联网技术的先进性与装设备资源管理的实际需求相融合&#xff0c;实现了对被装设备资源的即时追踪、智能化调控以及资源的最优化配置。以下是对被装物联网的深度剖析与高端解读&#xff1a;…

360推出全新的生成式 AI 搜索产品:纳米搜索,要重塑搜索产品

【大力财经】直击互联网最前线&#xff1a;360 集团在 2024 年 11 月 27 日开发布会&#xff0c;重磅推出了一款全新的生成式 AI 搜索产品——纳米搜索&#xff0c;并且已经上架到苹果 App Store 以及应用宝等安卓应用商店&#xff0c;直接与百度、阿里夸克、秘塔 AI、Perplexi…

Android Deep Links 深度链接解析

在实现 Android 应用链接之前&#xff0c;请务必了解您可以在 Android 应用中创建的不同类型的链接&#xff1a;深层链接、网页链接和 Android 应用链接。 Android Deep Links 深度链接解析 一、什么是Deep Links&#xff1f;二、Deep Links的优势三、Deep Links的实现方式1. …

setter方法注入(Java EE 学习笔记07)

属性setter方法注入是Spring最主流的注入方法&#xff0c;这种注入方法简单、直观&#xff0c;它是在被注入的类中声明一个setter方法&#xff0c;通过setter方法的参数注入对应的值。 案例&#xff1a; ① 创建User2实体&#xff0c;配置setter方法 package com.lq.entities…