微信小程序循环原数组并追加新元素（删除数组指定元素）

2024-04-20 18:32:15

今天新get到了一个小技能

push和concat的区别：

push 遇到数组参数时，把整个数组参数作为一个元素；而 concat 则是拆开数组参数，一个元素一个元素地加进去。

push 直接改变当前数组；concat 不改变当前数组。

就是在微信小程序中的数据处理的时候，有一些数据的数组里面的字段值又是对象包裹的，这样前端页面是不能直接取到值的，需要进行数据处理，例如：

我要取里面的supplier_text字段的值，那么我首先得数据处理一下值，拿出来：（把default_depot_text改成你需要的字段名）

 result.data.ROWS.forEach((item, index) => {row.push(JSON.parse(item.EXPAND_JSON).default_depot_text);refundData.push(item)})

要注意数据结构哦！！！

接下来的就是把它追加在原数组里面，这样wxml页面上才拿的到值

这里有两种办法：

一、直接追加法（推荐推荐）直接给数组Data：name+属性值

这样的话就直接push进了数组后面：很实用，而且没有什么局限 wxml页面输出：<text class="info-hd-text">{{item.name}}</text>

二、用push的方法

就是把refundData[i].name = row[j]换成了commentData[i].push(row[j]);

数据结构打印：（与前面追加的位置不一样） wxml页面输出为：<text class="info-hd-text">{{item[1]}}</text>

扩展补充：

想要删除数组的元素（亲测有效）

先在js里面写一个移除的方法：

 // 删除方法remove: function(array, val) {for (var i = 0; i < array.length; i++) {if (array[i] == val) {array.splice(i, 1);}}return -1;},

然后再在你需要删除数组元素的地方调用：

  var array = that.data.compressImg;  //你的数组数据var val = that.data.compressImg[inx];  //你要移除的元素标识，例如下标之类的that.remove(array, val);   //调用方法传参

就是这么简单，完美！

微信小程序循环原数组并追加新元素（删除数组指定元素）相关推荐

微信小程序循环 wxfor、wxfor-item(s)区别与联系、data-xxx、wx-key使用
微信小程序循环 wx:for.wx:for-item(s)区别与联系.data-xxx .wx-key使用 wx:for.wx:for-items.wx:for-item的区别和联系小程序的列表视图 ...
php 微信小程序循环多选,微信小程序循环及嵌套循环的使用
这篇文章主要介绍了微信小程序循环及嵌套循环的使用总结的相关资料,希望通过本文能帮助到大家,需要的朋友可以参考下微信小程序循环及嵌套循环的使用总结关于微信小程序,最近被安排做微信小程序,首次接触 ...
微信小程序foreach遍历_详解微信小程序循环及嵌套循环
本文主要介绍微信小程序循环及嵌套循环的使用总结的相关资料,希望通过本文能帮助到大家,需要的朋友可以参考下,希望能帮助到大家. 对于我们在js中从接口中通过POST或GET请求获取数据存放到Page中 ...
微信小程序循环出来的内容设置不同的样式
微信小程序循环出来的内容设置不同的样式循环出来的内容可以通过判断下标的方式添加想要的class样式或者style,例如: 设置类名 class="img {{index===1?'chan ...
微信小程序独家秘笈之左滑删除
代码地址如下: http://www.demodashi.com/demo/14056.html 一.前期准备工作软件环境:微信开发者工具官方下载地址:https://mp.weixin.qq.c ...
微信小程序-001-抽签功能-007-我的抽签-删除抽签
微信小程序-001-抽签功能-007-我的抽签-删除抽签目录一.wxml 二.js pages.chouqian.deleteqian.deleteqian 一.wxml 活动ID:{{rid}} ...
微信小程序循环列表添加动画animation
微信小程序内的css无法做到循环的动态 animationData变成[],数组里很多{}对象,就可以改变单独的值. WXML: <view class="context-full&q ...
php 微信小程序循环多选,微信小程序 for 循环详解
1,wx:for 在组件上使用wx:for控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件.默认数组的当前项的下标变量名默认为index,数组当前项的变量名默认为item 事例如下: wx ...
微信小程序文字下标_微信小程序循环下标微信小程序怎么做
微信小程序,多层数组,获取下标为Nan如何解决? 应该把Print a(i)放在Next i前面. 即生成一个随机数,就打印.循环执行. 放在后面的话应为执行了next,所以i = 6了,超出了a数组 ...

最新文章

热门文章