微信小程序数组（增，删，改，查）

最新推荐文章于 2026-03-31 02:21:50 发布

原创最新推荐文章于 2026-03-31 02:21:50 发布 · 3.5k 阅读

16 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#小程序

web前端同时被 2 个专栏收录

33 篇文章

订阅专栏

微信小程序

13 篇文章

订阅专栏

本文介绍如何在微信小程序中实现本地数据的增删改查操作，包括使用push()添加数据、splice()删除数据以及直接赋值的方式修改数据。

微信小程序数组（增，删，改，查）

最近在做一个小程序的demo里。由于不向后台请求数据，所以就涉及到本地数据的操作，本文以数据的增删改查为例

  globalData:{
     userInfo:null,
     notes:[
       {
         'title':'第一次笔记',
          'detail':'这是笔记详情，仅限测试'
       }， 
       {
         'title':'第二次笔记',
          'detail':'可以添加一个新的笔记'
       }
     ],
  }

首先这是原始数据，json的数组

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

1，数据的添加

 //保存备忘录
 saveNote: function(e){
   var obj = e.datail.value;
   var title = obj.title;
   var detail = obj.detail;
   if(title.length<=0 || detail.length<=0>){
     return;
   }
   this.data.notes.push(obj);
   var updata = this.data.notes;
   console.log(updata);
   app.globaData.notes = update;
   wx.redirectTo({
     url:'../notes/notes'
   });
 }

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

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

2,数据的删除

 wx:showModal({
   title:'提示',
   cntent:'是否删除该记录',
   success: function(res){
     if(res.confirm){
       var notes = that.data.notes;
       notes.splice(id,1);
       that.setData({
         notes:noes
       })
       console.log("删除成功");
     }
   }
 })

小程序里面没有remove方法，所以删除选择split,notes.splice(id,i)就可以从index为id的位置开始，删除i鸽元素。

3，数据的修改

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

 saveNote: function(e){
   var obj = e.detail.value;
   var title = obj.title;
   var detail = obj.detail;
   if(title.length<=0 || detail.length<=0){
    return;
   }
   var that = this;
   var notes = that.data.notes;
  var id = that.data.id;
  notes[id] = obj;
  app.globalData.notes = notes;
  wx.redirectTo({
    URL:'../notes/notes'
  })
 }