项目中 运用双层循环获取不到第一层的下标值该如何处理？

最新推荐文章于 2023-03-29 09:27:06 发布
原创 最新推荐文章于 2023-03-29 09:27:06 发布 · 468 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文探讨了在前端开发中，如何使用深拷贝解决双层遍历数据时样式更新不生效的问题。通过实例讲解了在点击事件中，如何正确传递下标及ID，并应用三元运算符来实现动态样式的效果。

先说说我们的项目需求，就是通过后台请求过来的数据进行了双层遍历，通过点击然后有不同的样式,需要将当前的下标及id传一下 并加上样式需要运用到三元运算：
如图：在这里插入图片描述

1、这个是在组件中渲染的样式
在这里插入图片描述
2、在data中定义一些初始化值
在这里插入图片描述
3、通过后台接口请求到数据
在这里插入图片描述

4、我们的问题所在：
只是将id index 传过去 并在布局用 三元运算符 判断 加样式 并不会出现效果

5、解决问题的方法利用深拷贝 object.assign()

在这里插入图片描述
用深拷贝吧每一层的值都层层拷贝，这样就OK辽

deidei3
关注
vue项目 双层循环第二层获取不到第一层的下标如何解决
weixin_46390400的博客
07-17 2411
比如这个项目当中分类中的年级学科 通过请求后台接口获取到数据 当点击年级中某个数据或学科中某个数据 需要将当前的下标及id传一下 并加上样式 原效果图如下： 如果 只是将id index 传过去 并在布局用 三元运算符 判断 加样式 并不会出现效果 出现这种问题的原因是 用双层循环 第一层只能用第一层的下标 而第二层 就不会拿到第一层的下标 解决此问题的方法可以 利用深拷贝 object.assign() 说到深拷贝 肯定涉及到浅拷贝 那么他们两个有什么区别呢？ 深拷贝 深拷贝复制变量值，对于非.
2022 第十四届蓝桥杯模拟赛第一期（题解与标程）
热门推荐
上山打老虎的博客
11-06 5万+
第十四届蓝桥杯模拟赛第一期
Vue：获取v-for循环中的数组下标、索引及数据
甜鲸鱼的博客
12-05 7418
在Vue中使用v-for取出排行榜数据，并根据排行榜的分类显示对应的排行榜内容。
使用vue时如何获取v-for数组的下标index值的方法
weixin_43968782的博客
10-28 2万+
<div v-for="(item,index) in arr" : key="index" @click="getIndex(item,index)"> <p>{{item}}</p> </div> methods:{ getIndex(item,index){ console.log(item,index) //这里的item是点击获取当前值的每一项内容 //这里的index是点击获取当前值的下标 } } ...
Angularjs 双重循环获取父级下标$index
nunumaymax的博客
07-31 2535
Angularjs 双重循环遍历获取父级下标$index$parent. $index需要注意的特殊情况 在angular.js中，我们遍历时会使用ng-repeat="col in arr track by $index"这个指令，通过这个 $index即可获取到当前项在该数组中的索引。但是当有两层循环（也就是使用了两层的ng-repeat=“col in arr track by $index”）的情况下， $index则是本层循环的索引，当我们的子级元素想要获取父级元素的索引该怎么做呢？ $paren
关于如何给for循环遍历出来的每一项注册事件并且在注册的事件里面打印出对应的下标...
weixin_33851177的博客
06-06 282
例如： 有六个li标签，我要获取六个li标签并且给每一个li标签注册点击事件，在点击事件里面打印当前li的下标 方法一： var $lis = $('li') for(var i = 0;i<$lis.length;i++){ (function(num){ $($lis[num]).on('click',function(){ ...
[[(x1,y1), (x2,y2), ...], ...] python 代码实现获取数据中的x1和y1
最新发布
03-31
比如示例数据[[[1,2],[3,4]], [[5,6],[7,8]]]，用户需要提取的是每个子列表中的第一个点，即[1,2]和[5,6]，然后可能还要把x1和y1分开成单独的列表。 接下来，我需要确定用Python怎么实现这个遍历。通常，可以使用...
【C语言功法手册】第四话· 快乐数组小课堂（可做小游戏）
kikokingの比特宇宙
05-20 1898
从今天开始，我将正式开启一个新的打卡专题——《C语言百炼成神计划》，没错！百炼成神，目的是通过百天刷题计划，通过题目和知识点串联的方式，完成C语言的复习和巩固；后期还会配有专门的笔记总结和文档教程哦！想要搞定，搞透C语言的同学，欢迎持续关注。.........
MATLAB图像缩放插值方法选择：项目实战指南
!... # 摘要 本文对MATLAB图像缩放技术进行...随后，通过MATLAB实现各种插值方法，并对比分析了它们在实际项目中的应用效果。文章还探讨了图像缩放的高级技术，包括优化策略和实际案例分析，以及在医疗成像、数码摄影和视
#微信小程序#wx:for循环时点击其中某个子组件如何获取它的下标？
weixin_43811390的博客
12-11 4902
问题描述：在小程序中写一个循环组件，需要实现这个功能：点击其中某个子组件，就把这个组件从这个数组中删除，但是不知道点击事件中返回e如何加入代表该子组件下标的信息。 wx:for用到的是一个普通数组[a,b,c]，不想要写一个对象数组，给每一个元素一个序号属性[{value:“a”, id:“0”}, {value:“b”, id:“1”}, {value:“c”, id:“2”}]，而是直接获取它的下标。 解决方法： <block wx:for="{{photoList}}" wx:f
VUE-两层for循环 外层长度会变化时，外层i--
过去过去，未来未来，当下永恒！
11-04 273
for (let i =this.dataForm.roleList.length-1; i>=0; i--) { let obj = this.dataForm.roleList[i] let deptTabId = obj.id debugger if (obj.type === '组织') { if (common.commonDeptRoles.length < 1) { thi
小程序获取点击事情的下标跟数据
weixin_61468763的博客
03-11 446
在标签里写 要有点击事件在js里获取传过来的值 获取循环的值 add点击事件在js中获取 给一个e参数 log一下可以查看 获取到的数据 之后你可以声明一个数组 把需要的数据更新到数组里 ...
微信小程序的点击事件获取下标currentTarget
h_j_c_123的博客
05-08 9626
微信小程序的点击事件获取下标e.currentTarget.dataset.index和e.target.dataset.index获取到的值都是未定义的问题；当我们采用block来循环数据时我们有时会想通过点击某个标签或者其他来完成一些事，但不管如何我们如何点击都是未定义那么问题出在哪，一般刚开始学习我们看资料，看别人都是将data-index这种标签绑定在block之上于是我们开始仿造于是不管...
VUE—v-for循环时获取下标并对dom节点进行操作（图文）
Poppy_LYT的博客
08-08 4188
VUE—v-for循环时获取下标并对dom节点进行操作 案例：v-for循环创建了很多按钮，点击每个按钮都会改变样式，利用ref 每个button都绑定一个点击事件并传一个下标值，（从0开始），通过ref和$refs对dom节点进行操作，改变字体颜色 ...
点击li获取对应事件下标的四种方法
Arjen123123的博客
10-31 2370
点击li获取对应事件下标的四种方法 在原生JS中，对于多个li的事件下标，是无法通过循环来直接获取，因为点击一次是一次事件，但是循环的执行会在一次事件中就完毕。第二次事件执行时循环已经结束。无法直接获取下标。 但是我们可以通过以下四种方案来解决这一问题： 例子如下： <body> <h1>国庆放假安排</h1> <ul> <li...
求助：嵌套for循环上一层循环中赋值的变量在下一层不再改变是为什么？
weixin_44770219的博客
03-04 814
代码如下： import os import csv with open("C:/Users/13554/Desktop/qsub_100-200_sample.sh","r")as f1,open("C:/Users/13554/Desktop/copynumber_50-100_qsub.sh","r") as f2,\ open("C:/Users/13554/Desktop/pil...
vue如何调用data双重数组的数据(双重for循环)
lplovewjm的博客
03-29 2852
本节主要讲解的的是用双重v-for调用data中双重数组的数据
uniapp数组视图发生改变，点击事件获取的下标存在
qq_36656155的博客
12-10 3373
开发环境：uniapp 背景：在项目中做了可上移、下移的一个数组 这里循环了 lists，给lists一个叫index的下标 <view class="list" v-for="(list,index) in lists" :key="index"> <view class="list-text"> {{list.text}} </view> &lt...
vue v-for嵌套 ，里层获取获取外层下标索引
a57521的博客
03-31 5778
vue v-for嵌套 ，里层获取获取使用外层下标索引 两层v-for嵌套 只要起不一样的名字就可以互相调用了 <div class="playChack" v-for="(item1,index1) in items" :key="index1"> <ul class="firstChack"> <li v-for="(item2,index2) in cha...
optind表示的是下一个将被处理到的参数在argv中的下标值。
09-30
当你调用`getopt()`解析命令行选项时，这个变量会自动递增，指向下一个未处理的参数位置。当`optind`等于`argc`时，意味着所有可供处理的参数都已经被处理过，后续的参数不再被视为选项。 例如，在`main()`函数中，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值