微信小程序 数组(增,删,改,查)等操作实例详解


Posted in Javascript onJanuary 05, 2017

微信小程序 数组(增,删,改,查)等操作

最近在做一个小程序的demo。由于不向后台请求数据,所以就涉及到对本地数据的操作,也遇到了一些坑,本文就以数组的增删改查为例,给新手分享一些经验。

微信小程序 数组(增,删,改,查)等操作实例详解

首先这是原始数据,json的数组。

我们尝试对改数据进行操作,同时渲染到页面。

1,数据的添加

微信小程序 数组(增,删,改,查)等操作实例详解微信小程序 数组(增,删,改,查)等操作实例详解微信小程序 数组(增,删,改,查)等操作实例详解

在获取到表单的数据后,自己组装一个对象,然后通过push()的方法添加一条数据,注意push的数据的index是+1的,也就是说原本数组中index依次为0,1,2,新增加的就是3,依次类推。

如果想在前面插入数据,就要用到数组合并的操作了,concat()方法可以选择合并到前面或者后面例如newarray.concat(notes);。

2,数据的删除

微信小程序 数组(增,删,改,查)等操作实例详解

小程序里面貌似没有remove的方法,所以删除我选择的是split方法,这也是遇到的一个坑。notes.splice(id,i)就可以从index为id的位置开始,删除i个元素,这点大家都懂,看代码就明白,不再赘述

3,数据的修改

notes = obj可以把数组中index为i的元素设置为obj。

微信小程序 数组(增,删,改,查)等操作实例详解微信小程序 数组(增,删,改,查)等操作实例详解微信小程序 数组(增,删,改,查)等操作实例详解

最后,如果要在修改数据的同时渲染到页面,一定要记得使用setData方法。

this.setData({    notes:notes })

顺便附上js里面array操作的方法列表。大家可以自己试试。

微信小程序 数组(增,删,改,查)等操作实例详解

Javascript 相关文章推荐
My Desktop :) 桌面式代码
Dec 29 Javascript
一个页面元素appendchild追加到另一个页面元素的问题
Jan 27 Javascript
Jquery日历插件制作简单日历
Oct 28 Javascript
详解vue-validator(vue验证器)
Jan 16 Javascript
VUE中使用Vue-resource完成交互
Jul 21 Javascript
前端axios下载excel文件(二进制)的处理方法
Jul 31 Javascript
详解如何在Node.js的httpServer中接收前端发送的arraybuffer数据
Nov 11 Javascript
elementUI多选框反选的实现代码
Apr 03 Javascript
分享JS表单验证源码(带错误提示及密码等级)
Jan 05 Javascript
vue 移动端记录页面浏览位置的方法
Mar 11 Javascript
js实现带有动画的返回顶部
Aug 09 Javascript
原生js实现自定义滚动条
Jan 20 Javascript
bootstrap制作jsp页面(根据值让table显示选中)
Jan 05 #Javascript
详解PHP中pathinfo()函数导致的安全问题
Jan 05 #Javascript
jQuery电话号码验证实例
Jan 05 #Javascript
纯原生js实现table表格的增删
Jan 05 #Javascript
微信小程序 tabs选项卡效果的实现
Jan 05 #Javascript
jQuery密码强度验证控件使用详解
Jan 05 #Javascript
jquery广告无缝轮播实例
Jan 05 #Javascript
You might like
怎样才能成为PHP高手?学会“懒惰”的编程
2006/12/05 PHP
默默简单的写了一个模板引擎
2007/01/02 PHP
PHP error_log()将错误信息写入一个文件(定义和用法)
2013/10/25 PHP
采用header定义为文件然后readfile下载(隐藏下载地址)
2014/01/31 PHP
php实现简单的语法高亮函数实例分析
2015/04/27 PHP
配置Nginx+PHP的正确思路与过程
2016/05/10 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
ThinkPHP框架使用redirect实现页面重定向的方法实例分析
2018/04/12 PHP
HR vs ForZe BO3 第二场 2.13
2021/03/10 DOTA
jquery 插件之仿“卓越亚马逊”首页弹出菜单效果
2008/12/25 Javascript
JS TextArea字符串长度限制代码集合
2012/10/31 Javascript
JavaScript之IE的fireEvent方法详细解析
2013/11/20 Javascript
使用jQuery实现返回顶部
2015/01/26 Javascript
JS实现点击按钮获取页面高度的方法
2015/11/02 Javascript
详解JavaScript函数对象
2015/11/15 Javascript
在vue中添加Echarts图表的基本使用教程
2017/11/22 Javascript
用最少的JS代码写出贪吃蛇游戏
2018/01/12 Javascript
Express的HTTP重定向到HTTPS的方法
2018/06/06 Javascript
JS继承实现方法及优缺点详解
2020/09/02 Javascript
Python的批量远程管理和部署工具Fabric用法实例
2015/01/23 Python
浅谈Python中的闭包
2015/07/08 Python
python如何实现excel数据添加到mongodb
2015/07/30 Python
Flask 让jsonify返回的json串支持中文显示的方法
2018/03/26 Python
Python read函数按字节(字符)读取文件的实现
2019/07/03 Python
Django发送邮件和itsdangerous模块的配合使用解析
2019/08/10 Python
Python 实现平台类游戏添加跳跃功能
2020/03/27 Python
美国排名第一的葡萄酒俱乐部:Firstleaf Wine Club
2020/01/02 全球购物
SQL Server里面什么样的视图才能创建索引
2015/04/17 面试题
抽样调查项目计划书
2014/04/24 职场文书
人事任命书格式
2014/06/05 职场文书
应聘会计求职信
2014/06/11 职场文书
学校捐书倡议书
2015/04/27 职场文书
幼儿园综治宣传月活动总结
2015/05/07 职场文书
围城读书笔记
2015/06/26 职场文书
重温经典:乔布斯在斯坦福大学的毕业演讲(双语)
2019/08/26 职场文书
PyTorch中的torch.cat简单介绍
2022/03/17 Python