Page({
data: {
list:[{
id:1,
name:'应季鲜果',
count:1
},{
id:2,
name:'精致糕点',
count:6
},{
id:3,
name:'全球美食烘培原料',
count:12
},{
id:4,
name:'无辣不欢生猛海鲜',
count:5
}]
}
})

一、向前向后新增数组

//假设这一段是我们要新增的数组
var newarray = [{
id:5,
name:'向后增加数据--'+new Date().getTime() ,
count:89
}]; //向前--用newarray与this.data.list合拼
this.data.list = newarray.concat(this.data.list); //向后--用this.data.list与newarray合拼
this.data.list = this.data.list.concat(newarray); //页面渲染数据
this.setData({
'list': this.data.list
});

二、修改数组

//修改数组
edit:function (e){ //这个参数“e”的具体作用,请参考微信小程序官方提供的说明,地址为https://mp.weixin.qq.com/debug/wxadoc/dev/framework/view/wxml/event.html?t=20161107 var dataset = e.target.dataset;
var Index = dataset.index; //在通过在wxml页面里使用 data-index="{{index}}"传递过来的,是为识别正在编辑修改哪个数组。 //我们要修改的数组
this.data.list[Index].name = '修改了内容'+new Date().getTime(); //将合拼之后的数据,发送到视图层,即渲染页面
//大伙请记录,修改了数据后,一定要再次执行`this.setData()`,页面才会渲染数据的。
this.setData({
list:this.data.list
}); }

三、删除数据

//删除
remove:function (e){ var dataset = e.target.dataset;
var Index = dataset.index; //通过`index`识别要删除第几条数据,第二个数据为要删除的项目数量,通常为1
this.data.list.splice(Index,1); //渲染数据
this.setData({
list:this.data.list
});
}

四、清空数据

//清空
clear:function (){ //其实就是让数组变成一个空数组即可
this.setData({
list:{}
}); }

Array对象方法列表

【微信小程序】数组操作的更多相关文章

  1. 微信小程序-数组操作

    Page({ data: { list:[{ id:, name:'芒果', count: },{ id:, name:'香蕉', count: }, }] } }) 向前插入数据 //要增加的数组 ...

  2. 微信小程序相关操作

    显示用户基本信息 在微信小程序中,经常会碰到需要展示微信用户的基本信息,如果只是为了显示用户信息,最简单有效的办法是使用open-data,这是微信小程序内置的用于展示微信开放数据的组件,通过改变ty ...

  3. 微信小程序数组对象

    xml:<block wx:for="{{post_key}}" wx:for-item="{{item}}"></block> dat ...

  4. 微信小程序 数组索引 data-“”解释

    按照官方最新文档循环的方式,索引值是以  wx:for-index="index" 方式写的, 以   parseInt(event.currentTarget.dataset.i ...

  5. 微信小程序——动画操作时,rpx 和 px 的转换计算。

    嫌长版本: var rpx = 10000; var systemInfo = wx.getSystemInfoSync(); var px = rpx / 750 * systemInfo.wind ...

  6. 微信小程序不可操作dom节点

    //根据历史记录快速搜索 fastSearch:function(e){ console.log(e.currentTarget.id) wx.navigateTo({ url: '../search ...

  7. 【微信小程序】认识微信小程序

    目前微信小程序已经支持个人版了 罗列一下微信开发的一些资料和工具 (如果你还不了解微信小程序如何操作请点击  新手教程 )里面罗列了 开发者工具 如何使用 和 微信的基本操作 很详细 一.微信开发者工 ...

  8. 微信小程序之换肤的功能

    pc或者移动端实现换肤功能还是比较简单的,大致就是需要换肤的css,还有正常的css:把当前皮肤类型存入本地:然后通过js读取并判断当前应该加载哪套css. 由于微信小程序没有操作wxss的api,所 ...

  9. 微信小程序之数组操作:push与concat的区别

    微信小程序中需要用到数组的操作,push和concat二者功能很相像,但有两点区别. 先看如下例子: var arr = []; arr.push(); arr.push(); arr.push([, ...

随机推荐

  1. 【NGINX】LINUX安装NGINX

    安装依赖() · yum install gcc · yum install pcre-devel · yum install zlib zlib-devel · yum install openss ...

  2. 2020新春公益赛 writeup

    简单的招聘系统 无需注册账号,admin'or 1#登陆,到blank page页面,在输入key处发现有注入点: /pages-blank.php?key=1%27+union+select+1%2 ...

  3. Matlab的简单数据保存读取

    1.使用load进行文件读取 例如读入文件名为'filename.txt'中的数据,那么可以使用以下代码: load('filename.txt') 注意:filename.txt中的数据应符合矩阵形 ...

  4. PTA的Python练习题(七)

    不知不觉一个星期过去了,继续从 第3章-12 求整数的位数及各位数字之和 开始做题 1. 我原来想用题目漏洞做题的,不过想想还是算了自己写个完整的: a=int(input()) b=len(str( ...

  5. NFS文件服务器

    NFS文件服务器 NFS介绍 应用场景 NFS安装部署 NFS共享 客户端NFS共享挂载 一.NFS介绍 NFS(Network File System)即网络文件系统,它允许网络中的计算机之间通过T ...

  6. Django manager 命令笔记

    1. 新建app startapp your_app_name 2. 删除app migrate your_app_name zero 此外还需要删除整个App文件夹,并在settings.py的In ...

  7. vue中 el [$el] 的理解

    <template> <div class="a"> <div class="basic" ref="ba"& ...

  8. Day11 - O - Coin Game HDU - 3951

    题目链接 思路:考虑第一个人取的方式: 1.每次能取的次数>= n, 一次取完 first win 2.每次能取1个,n是奇数 first win 3.一次取不完,这种情况下也分2种情况 1)s ...

  9. C语言程序设计-现代方法(笔记3)

    第十三章 字符串 1.字符串字面量(13.1) 字符串字面量:用一对双引号括起来的字符序列.字符串字面量可以像字符常量一样包含转义字序列. 在字符串字面量中小心使用八进制和十六进制的转义序列. 字符串 ...

  10. elasticsearch mapping简单介绍

    这两天一直在看elasticsearch相关的内容,看到mapping这一块,就折腾了下. 一般情况下,我们不需要对elasticsearch的mapping进行设置,但如果希望对索引使用自定义的管理 ...