WXML:

<view class="container">
<view wx:for="{{list}}" wx:key="this" style="padding: 10px 0;border-bottom: 1px solid #ddd;">
<view>
{{index+1}}、{{item.name}}
</view>
<view class="textright font12" style="color: #2A53CD;">
<text bindtap="remove" data-index="{{index}}" class="marlr10">删除</text>
<text bindtap="edit" data-index="{{index}}" >修改</text>
</view>
</view>
<button class="martop20" bindtap="add_before">
向前插入数组
</button>
<button class="martop20" bindtap="add_after">
向后插入数组
</button>
<button class="martop20" bindtap="clear">
清空数组
</button>
</view>

WXSS:

/**index.wxss**/
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
} .userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: %;
} .userinfo-nickname {
color: #aaa;
} .usermotto {
margin-top: 200px;
}

JS:

//index.js
//获取应用实例
var app = getApp()
Page({
data: {
list:[{
id:,
name:'应季鲜果',
count:
},{
id:,
name:'精致糕点',
count:
},{
id:,
name:'全球美食烘培原料',
count:
},{
id:,
name:'无辣不欢生猛海鲜',
count:
}]
},
//向前增加数据
add_before:function (){
//要增加的数组
var newarray = [{
id:,
name:'向前增加数据--'+new Date().getTime() ,
count:
}];
this.data.list = newarray.concat(this.data.list);
this.setData({
'list': this.data.list
});
},
//向后增加数据
add_after:function (){ //要增加的数组
var newarray = [{
id:,
name:'向后增加数据--'+new Date().getTime() ,
count:
}];
this.setData({
'list':this.data.list.concat(newarray)
});
},
//删除
remove:function (e){ var dataset = e.target.dataset;
var Index = dataset.index; //拿到是第几个数组 this.data.list.splice(Index,); this.setData({
list:this.data.list
});
},
//修改
edit:function (e){
var dataset = e.target.dataset;
var Index = dataset.index; //拿到是第几个数组
this.data.list[Index].name = '修改了内容'+new Date().getTime(); this.setData({
list:this.data.list
});
},
//清空
clear:function (){ this.setData({
list:[]
});
} })

效果图如下:

小程序中data数据的处理方法总结(小程序交流群:604788754)的更多相关文章

  1. 小程序中data数据的处理方法总结

    wxml代码: <view class="container"> <view wx:for="{{list}}" wx:key="t ...

  2. 【Android进阶】怎样使用文件来保存程序中的数据

    在程序中.有非常多保存和获取数据的方法,本篇文章,主要介绍使用文件系统对程序中的数据进行保存和读取的操作 我直接写了一个帮助类,进行文件的写入和读取操作 /** * 用于在文件里保存程序数据 * * ...

  3. PatentTips - 在物联网中进行数据过滤的方法和装置

    背景技术 [0001] 本发明涉及物联网,特别涉及在物联网进行数据过滤的方法和装置. [0002] 物联网是新一代信息技术的重要组成部分,特指物物相连的网络.具体地,物联网是指通过各种信息传感设备,如 ...

  4. 如何在原生微信小程序中实现数据双向绑定

    官网:https://qiu8310.github.io/minapp/ 作者:Mora 在原生小程序开发中,数据流是单向的,无法双向绑定,但是要实现双向绑定的功能还是蛮简单的! 下文要讲的是小程序框 ...

  5. excel中的数据导入oracle方法

    SQL_loader批量上传数据 1.    注释 在工作中,很多时候会遇到如下情况:需要将excel中的数据批量上传到ORACLE表中.如果是小数据量,如几十条至几百条,那么用plsql dev工具 ...

  6. 归纳从文件中读取数据的六种方法-JAVA IO基础总结第2篇

    在上一篇文章中,我为大家介绍了<5种创建文件并写入文件数据的方法>,本节我们为大家来介绍6种从文件中读取数据的方法. 另外为了方便大家理解,我为这一篇文章录制了对应的视频:总结java从文 ...

  7. SAP SMARTFORMS-基于内存方式在report程序中传递数据到smartforms显示

    一.准备工作 1.新建include程序 1> include程序名字:ZDD_INC_0104 2> ZDD_INC_0104  程序中的内容为 2.使用T-CODE :SE11新建两个 ...

  8. 判断js中各种数据的类型方法之typeof与0bject.prototype.toString讲解

    提醒大家,Object.prototype.toString().call(param)返回的[object class]中class首字母是大写,像JSON这种甚至都是大写,所以,大家判断的时候可以 ...

  9. C++程序中调用其他exe可执行文件方法

    在编程过程中有个需求,点击某个按钮需要弹出系统的声音控制面板.在网上查了下代码中调用其他exe程序或者打开其他文件的方法. 自己借鉴网上的文章稍微总结下,加深下印象,也给方便自己用. 在代码中调用其他 ...

随机推荐

  1. react小知识点

    1.render函数什么时候会执行? 当this.state/this.props发生改变的时候render函数就会执行 2.组件第一次执行的时候会执行哪些生命周期 constructor--> ...

  2. OGG 18.1 for mysql远程捕获测试

    Ogg18.1 remote capture要求mysql为5.7版本,只能从linux远程捕获mysql on windows or linux,且不支持DDL捕获.支持远程mysql为commun ...

  3. Hadoop-Impala学习笔记之管理

    配置参数管理 待补充... 资源分配管理(Admission Control) Impala有资源池的概念,允许某些查询在特定的资源池执行,不过在白天不跑批/晚上不跑adhoc的DSS系统中,该机制并 ...

  4. 无法在web.xml或使用此应用程序部署的jar文件中解析绝对uri:[http://java.sun.com/jsp/jstl/core]

    访问jsp文件时,出现错误: 解决办法: 1.在Tomcat目录下的lib文件夹中加入jstl包 2. 在maven项目中加入jstl包:

  5. 使用tp访问数据库时提示错误: 'PDO' not found, 和not defined constant mysql_attr_init_command 和call an undefined function Think\Template\simpleXml_load_string()函数

    第一个问题: PDO not found 是因为 php没有安装pdo扩展, 无法提供给 php 以 数据库访问功能, 所以 报错是在文件: Think/Db.class.php的里面. 解决方法是: ...

  6. MySQL 之 索引原理与慢查询优化

    当考虑到数据多的时候,并且要加速查询时候,就不得不 用到索引了. 索引本质:通过不断地缩小想要获取数据的范围来筛选出最终想要的结果,同时把随机的事件变成顺序的事件, 也就是说,有了这种索引机制,我们可 ...

  7. pyhon-request之repsonse的常用方法reponse.text和reponse.content的区别

    1. requests在python2 和 python3中通用,方法完全一样 2. request简单易用 requests的作用 作用:发送网络请求,返回响应数据 用法 response = re ...

  8. spring data jpa开启批量插入、批量更新

    spring data jpa开启批量插入.批量更新 原文链接:https://www.cnblogs.com/blog5277/p/10661096.html 原文作者:博客园--曲高终和寡 *** ...

  9. script 修改 plist遇到的问题

    一个sh脚本每次build的时候动态修改info.plist文件 达到动态更改版本号的目的 但是估计是因为缓存的缘故 每次只有clean之后再运行才会修改成功 看script执行的log 好像是先修改 ...

  10. day1——分割数组

    // 小白一名,0算法基础,艰难尝试算法题中,若您发现本文中错误, 或有其他见解,往不吝赐教,感激不尽,拜谢. 领扣 第915题 今日算法题干//给定一个数组 A,将其划分为两个不相交(没有公共元素) ...