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

 更新时间:2017年01月05日 15:44:49   投稿:lqh  
这篇文章主要介绍了微信小程序 数组(增,删,改,查)等操作实例详解的相关资料,这里对小程序的数组进行操作,简单实例,需要的朋友可以参考下

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

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

QQ图片20170103101514.png

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

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

1,数据的添加

QQ图片20170103101725.pngQQ图片20170103103601.pngQQ图片20170103103626.png

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

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

2,数据的删除

QQ图片20170103104214.png

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

3,数据的修改

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

QQ图片20170103103701.pngQQ图片20170103103714.pngQQ图片20170103104137.png

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

 this.setData({    notes:notes }) 

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

20161113232801.jpg

相关文章

  • 微信小程序 教程之引用

    微信小程序 教程之引用

    这篇文章主要介绍了微信小程序引用的相关资料,并附简单实例代码,需要的朋友可以参考下
    2016-10-10
  • 微信小程序 POST请求(网络请求)详解及实例代码

    微信小程序 POST请求(网络请求)详解及实例代码

    这篇文章主要介绍了微信小程序 POST请求(网络请求)详解及实例代码的相关资料,需要的朋友可以参考下
    2016-11-11
  • Page Visibility API 教程示例

    Page Visibility API 教程示例

    这篇文章主要为大家介绍了Page Visibility API 的教程示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • JavaScript原型Prototype详情

    JavaScript原型Prototype详情

    这篇文章主要介绍了JavaScript原型Prototype,在JavaScript中,函数是一个包含属性和方法的Function类型的对象。而原型(Prototype )就是Function类型对象的一个属性。具体内容需要的朋友可以参考下面文章的介绍
    2021-12-12
  • arco design按需导入报错排查思路与解决方案解析

    arco design按需导入报错排查思路与解决方案解析

    这篇文章主要为大家介绍了arco design 按需导入报错排查思路与解决方案解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • 前端框架arco table源码遇到的问题解析

    前端框架arco table源码遇到的问题解析

    这篇文章主要为大家介绍了前端框架arco table源码遇到的问题解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-02-02
  • JS前端设计模式之发布订阅模式详解

    JS前端设计模式之发布订阅模式详解

    这篇文章主要为大家介绍了JS前端设计模式之发布订阅模式详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • 微信小程序之前台循环数据绑定

    微信小程序之前台循环数据绑定

    这篇文章主要介绍了微信小程序之前台循环数据绑定的相关资料,这里提供实例帮助大家学习理解这部分内容,需要的朋友可以参考下
    2017-08-08
  • 微信小程序 获取二维码实例详解

    微信小程序 获取二维码实例详解

    这篇文章主要介绍了 微信小程序 获取二维码实例详解的相关资料,需要的朋友可以参考下
    2017-06-06
  • 微信小程序 页面跳转事件绑定的实例详解

    微信小程序 页面跳转事件绑定的实例详解

    这篇文章主要介绍了微信小程序 页面跳转事件绑定的实例详解的相关资料,希望通过本文大家能够理解并应用小程序页面跳转及事件绑定的实例,需要的朋友可以参考下
    2017-09-09

最新评论