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

 更新时间: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

相关文章

  • 纯js实现高度可扩展关键词高亮方案详解

    纯js实现高度可扩展关键词高亮方案详解

    这篇文章主要为大家介绍了纯js实现高度可扩展关键词高亮方案详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • JS中的四种数据类型判断方法

    JS中的四种数据类型判断方法

    js有多种数据类型(Number(数值)、String(字符串)、Boolean(布尔值)、Null、Undefined、Symbol、Object、函数等),在开发过程中难免需要判断数据类型,本文总结了四种判断方法给大家分享,需要的朋友可以参考一下
    2021-11-11
  • 微信小程序开发之Tabbar实例详解

    微信小程序开发之Tabbar实例详解

    这篇文章主要介绍了微信小程序开发之Tabbar实例详解的相关资料,需要的朋友可以参考下
    2017-01-01
  • 微信小程序日历组件calendar详解及实例

    微信小程序日历组件calendar详解及实例

    这篇文章主要介绍了微信小程序日历组件calendar详解及实例的相关资料,需要的朋友可以参考下
    2017-06-06
  • 一看就懂的JavaScript适配器模式图解及使用示例

    一看就懂的JavaScript适配器模式图解及使用示例

    这篇文章主要为大家介绍了JavaScript适配器模式图解及使用示例分析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-12-12
  • 微信小程序 Record API详解及实例代码

    微信小程序 Record API详解及实例代码

    这篇文章主要介绍了微信小程序 Record API详解及实例代码的相关资料,需要的朋友可以参考下
    2016-09-09
  • JavaScript函数柯里化

    JavaScript函数柯里化

    这篇文章主要介绍了JavaScript函数柯里化,柯里化即Currying是把接受多个参数的函数变换成接受一个单一参数函数,并且返回接受余下的参数且返回结果的新函数的技术,下面文章详细内容,需要的朋友可以参考一下
    2021-11-11
  • JavaScript基本语法讲解

    JavaScript基本语法讲解

    这篇文章主要介绍了JavaScript的基本语法,包括注释和书写格式等基本知识,需要的朋友可以参考下
    2015-06-06
  • JavaScript 与 TypeScript之间的联系

    JavaScript 与 TypeScript之间的联系

    这篇文章主要介绍了 JavaScript 与 TypeScript之间的联系,JavaScript,也称为 JS,是一种符合 ECMAScript 规范的编程语言。这是一个高级别的、通常是即时编译的、多范式的。TypeScript 是一种强类型、面向对象的编译语言,更多消息内容,需要的朋友可以参考一下下面文章内容
    2021-11-11
  • JavaScript严格模式不支持八进制的问题讲解

    JavaScript严格模式不支持八进制的问题讲解

    这篇文章主要讲解JavaScript严格模式不支持八进制的问题,本文围绕JavaScript严格模式展开内容,详细介绍为什么JavaScript严格模式不支持八进制,下面来看看详细介绍,需要的朋友可以参考一下
    2021-11-11

最新评论