:style动态绑定,但只要页面发生变化就会执行一次方法

1、问题

开发过程中有个需求是遍历列表绘制div,div的样式是后端接口传来的,一开始这种写法,:style=“formatStyle(item)”,写在了模板中

这样写发现一个问题,只要页面发生重绘,比如页面输入框输入数字,formatStyle
会重复执行,太耗性能

2、解决

在拿到列表数据时给列表每个对象加个iStyle属性

  <div v-for="item in copylayerList" :key="item.id"><div class="layer_div" :style="item.iStyle" @click="editLaywer(item)"><span class="layer_div_text">{{item.name}}</span></div></div>

我这里是访问接口拿到数据后,遍历数组给数组对象添加属性

    http.get("/XXX", this.listQuery).then((res) => {if (res.code == 200) {this.copylayerList = [...res.data.list];this.copylayerList.map((item) => {item.iStyle = this.formatStyle(item)})}});

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

移动App安全检测的必要性,app安全测试报告的编写注意事项

随着移动互联网的迅猛发展&#xff0c;移动App已经成为人们日常生活中不可或缺的一部分。然而&#xff0c;虽然App给我们带来了便利和乐趣&#xff0c;但也伴随着一些潜在的安全风险。黑客、病毒、恶意软件等威胁着用户的隐私和财产安全&#xff0c;因此进行安全检测就显得尤为…

acwing算法基础之数据结构--KMP算法

目录 1 知识点2 模板 1 知识点 KMP算法已经集成到string类型的find()方法了&#xff0c; 但这里我们不用这个&#xff0c;我们自己来实现这个方法。 KMP算法的关键步骤&#xff1a; p[N]表示输入模式串&#xff0c;求取该模式串的ne[]数组。ne[i]表示前缀等于后缀的长度&…

UE4 UltrDynamicSky与场景物体进行交互

找到材质 找到其最父类的材质 把这个拖过去连上即可

TikTok Shop新结算政策:卖家选择权加强,电商市场蓄势待发

据悉&#xff0c;从2023年11月1日开始&#xff0c;TikTok Shop将根据卖家的店铺表现来应用3种不同类型的结算期&#xff0c;其中&#xff0c;标准结算期&#xff1a;资金交收期为8个日历日&#xff1b;快速结算期&#xff1a;资金交收期为3个日历日&#xff1b;延长结算期&…

尚硅谷Flink(完)FlinkSQL

&#x1f9d9;FlinkSQL&#x1f3c2;&#x1f93a; Table API 和 SQL 是最上层的 API&#xff0c;在 Flink 中这两种 API 被集成在一起&#xff0c;SQL 执行的对象也是Flink 中的表&#xff08;Table&#xff09;&#xff0c;所以我们一般会认为它们是一体的。 SQL API 是基于…

Python学习基础笔记七十七——json序列化

客户端和服务端之间需要交换数据才能完成各种功能。 假设 服务端程序都是用Python语言开发的话&#xff0c;那么 服务端从数据库中获取的最近的交易列表&#xff0c;可能就是像下面这样的一个Python列表对象&#xff1a; historyTransactions [{time : 20170101070311, #…

mysql过期数据的清理方案(Java/springboot+mybatis)

比如说现在数据库表信息增加的很快&#xff0c;然后我们需要对每个表设置过期删除策略&#xff1b; 大概思路就是&#xff1a;定时任务调度&#xff0c;给每个表制定sql&#xff0c;然后执行删除数据的sql //删除一个月前的数据 delete FROM test_info WHERE create_time <…

C++初阶--C++入门(2)

C入门&#xff08;1&#xff09;链接入口 文章目录 内联函数auto关键字注意事项 基于范围的for循环(C11)nullptr 内联函数 以inline修饰的函数叫做内联函数&#xff0c;编译时C编译器会在调用内联函数的地方展开&#xff0c;没有函数调用建立栈帧的开销&#xff0c;内联函数提…

ND协议——无状态地址自动配置 (SLAAC)

参考学习&#xff1a;计算机网络 | 思科网络 | 无状态地址自动配置 (SLAAC) | 什么是SLAAC_瘦弱的皮卡丘的博客-CSDN博客 与 IPv4 类似&#xff0c;可以手动或动态配置 IPv6 全局单播地址。但是&#xff0c;动态分配 IPv6 全局单播地址有两种方法&#xff1a; 如图所示&#…

『C++ - STL』之优先级队列( priority_queue )

文章目录 前言优先级队列的结构优先级队列的模拟实现仿函数 最终代码 前言 什么是优先级队列&#xff0c;从该名中可以知道他一定有队列的一定属性&#xff0c;即先入先出(LILO)&#xff0c;而这里的优先级则可以判断出它的另一个特点就是可以按照一定的条件将符合该条件的先进…

移动设备管理对企业IT 安全的增强

移动设备管理 &#xff08;MDM&#xff09; 是通过定义策略和部署安全控制&#xff08;如移动应用程序管理、移动内容管理和条件 Exchange 访问&#xff09;来管理移动设备的过程。 完整的MDM解决方案可以管理在Android&#xff0c;iOS&#xff0c;Windows&#xff0c;macOS&a…

【论文解读】单目3D目标检测 DD3D(ICCV 2021)

本文分享单目3D目标检测&#xff0c;DD3D 模型的论文解读&#xff0c;了解它的设计思路&#xff0c;论文核心观点&#xff0c;模型结构&#xff0c;以及效果和性能。 一、DD3D简介 DD3D是一种端到端、单阶段的单目3D目标检测方法&#xff0c;它在训练时用到了点云数据&#xf…

索引失效的几种情况

目录 数据准备&#xff1a; 1、查询条件中有or&#xff0c;索引会失效&#xff1b; 2、like查询以%开头 3、如果类型为字符串&#xff0c;查询条件中数据需用引号引起来&#xff0c;否则不走索引&#xff1b; 4、索引列上参与计算会导致索引失效 5、违背最左匹配原则 6、…

[Hive] explode

在 Hive 中&#xff0c;explode 函数用于将数组&#xff08;Array&#xff09;或者Map类型的列拆分成多行&#xff0c; 每个元素或键值对为一行。这允许我们在查询中对数组或 Map 进行扁平化操作。 下面是使用 explode 函数的示例&#xff1a; 假设我们有一个包含数组字段的表…

面试知识点--基础篇

文章目录 前言一、排序1. 冒泡排序2. 选择排序3. 插入排序4. 快速单边循环排序5. 快速双边循环排序6. 二分查找 二、集合1.List2.Map 前言 提示&#xff1a;以下是本篇文章正文内容&#xff0c;下面案例可供参考 一、排序 1. 冒泡排序 冒泡排序就是把小的元素往前调或者把大…

flutter 创建插件

资料&#xff1a; flutter与原生通信的方式简介 - 简书 完整流程 Flutter 集成 Golang 多语言跨端开发基础案例 - 知乎 https://www.cnblogs.com/webabcd/p/flutter_lib_plugin_plugin_ios.html 步骤1、创建插件 我创建的插件名字是konnect_im_sdk 选择的语言是 java和swi…

22款奔驰S400L升级原厂360全景影像 倒车更加的安全

您是否经历过这种场面呢&#xff1f; 停车位&#xff0c;狭窄障碍停车困难 避免盲区&#xff0c;倒车盲区危及生命安全 狭窄路段&#xff0c;无法判断是否安全通过 视角盲区&#xff0c;小孩站在视野盲区看不到&#xff0c;Xjh15863 360度无缝3D全车可见&#xff0c;解决各…

uniapp开发多端应用项目时的常见跨端兼容处理

一、跨端兼容 每个端有每个端的特点&#xff0c;有的能被抹平&#xff0c;有的不可能被抹平。 跨端&#xff0c;不是把web的习惯迁移到全平台。而是按照uni的写法&#xff0c;然后全平台使用。 按照uniapp规范开发可以保证多平台兼容&#xff0c;但每个平台有自己的一些特性。…

02、MySQL-------主从复制

目录 七、MySql主从复制启动主从复制&#xff1a;原理&#xff1a;实现&#xff1a;1、创建节点2、创建数据库3、主从配置1、主节点2、从节点 4、测试&#xff1a;5、问题&#xff1a;1、uuid修改2、service_id3、读写不同步方法1&#xff1a;方法2&#xff1a; 七、MySql主从复…

【VR】【Unity】如何调整Quest2的隐藏系统时间日期

【背景】 网络虽然OK&#xff0c;但是Oculus Quest要连上商店还必须调整好系统时间&#xff0c;不过在Quest系统中&#xff0c;时间对用户是不可见的&#xff0c;本篇介绍调整的方法。 【方法】 打开SideQuest&#xff0c;没有的话先去下载一个。打开后先登录&#xff0c;如…