• 【微信小程序】数组操作


    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对象方法列表

  • 相关阅读:
    安装curl依赖库后yum不能使用问题解决
    leetcode Container With Most Water
    leetcode Median of Two Sorted Arrays
    leetcode Add Two Numbers(对指针的一些基本操作)
    hdu 4427 DP
    hdu 4454 三分*****
    HDU5917 RAMSEY定理
    UVAlive7501 Business Cycle 2015ECfinal B(二分模板)
    已知圆半径和外接正多边形边数求边长
    hdu4799 树型DP
  • 原文地址:https://www.cnblogs.com/weiboyuan/p/9232283.html
Copyright © 2020-2023  润新知