小程序实现列表删除功能


Posted in Javascript onOctober 30, 2018

本文实例为大家分享了小程序列表删除功能的具体代码,供大家参考,具体内容如下

  • 地址簿删除,先获取当前地址部分的id值,根据id值来删除对应的地址部分。
  • 获取全部的地址信息,定义一个空的数组newallData,用来放置新的地址信息。
  • 在全部地址信息中删除选中的id的地址信息,生成新的地址信息放入定义的空数组中。
  • 现在newallData就是删除选中地址信息以后剩下的地址信息,在newallData中的信息渲染在页面。

wml文件:

<!-- 删除 -->
<view class="delete" bindtap="deleteaddress" data-id="{{ item.id }}">删除</view>

js文件:

deleteaddress(e){
  let that = this;
  console.log(e);
  let deldeid = e.currentTarget.dataset.id;
  let allDatas = that.data.allData;
  let newallData = [];
  for (var i in allDatas) {
   var item = allDatas[i];
   if (item.id != deldeid) {
    newallData.push(item);
   }
  } 
  console.log(newallData)
  wx.showModal({
   'content': '确认删除该地址信息吗?',
   'cancelColor': '#0076FF',
   'confirmColor': '#0076FF',
   success: function (res) {
    if (res.confirm) {
     console.log('用户点击确定')
     let url = getApp().Api_url + '/receiver/delete';
     requestd._post(url, { receiverId: e.currentTarget.dataset.id }, function (res2) {
      console.log(res2);
      if( res2.data.status == 1 ){
       that.setData({
        allData: newallData
       });
      }else{
       wx.showModal({
        'showCancel': false,
        'content': res2.data.message,
        'confirmColor': '#0076FF'
       })
      }
     }, function (res2) { })
    } else if (res.cancel) {
     console.log('用户点击取消')
    }
   }
  })

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
权威JavaScript 中的内存泄露模式
Aug 13 Javascript
用Javascript实现Windows任务管理器的代码
Mar 27 Javascript
Javascript基础教程之break和continue语句
Jan 18 Javascript
javascript实现在指定元素中垂直水平居中
Sep 13 Javascript
JS运动相关知识点小结(附弹性运动示例)
Jan 08 Javascript
canvas 绘制圆形时钟
Feb 22 Javascript
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
Mar 09 Javascript
基于LayUI实现前端分页功能的方法
Jul 22 Javascript
详解VUE里子组件如何获取父组件动态变化的值
Dec 26 Javascript
JS 实现发送短信验证码的“59秒后重新发送验证短信”功能
Aug 23 Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
Nov 20 Javascript
Vue混入mixins滚动触底的方法
Nov 22 Javascript
require.js 加载过程与使用方法介绍
Oct 30 #Javascript
小程序实现左滑删除功能
Oct 30 #Javascript
提升node.js中使用redis的性能遇到的问题及解决方法
Oct 30 #Javascript
小程序云开发部署攻略(图文教程)
Oct 30 #Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 #Javascript
微信小程序实现单选功能
Oct 30 #Javascript
基于vue2.0实现仿百度前端分页效果附实现代码
Oct 30 #Javascript
You might like
用PHP+MySql编写聊天室
2006/10/09 PHP
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
php var_export与var_dump 输出的不同
2013/08/09 PHP
浅析Yii2 GridView 日期格式化并实现日期可搜索教程
2016/04/22 PHP
PHP 在数组中搜索给定的简单实例 array_search 函数
2016/06/13 PHP
PHP+mysql实现从数据库获取下拉树功能示例
2017/01/06 PHP
jquery入门必备的基本认识及实例(整理)
2013/06/24 Javascript
子窗体与父窗体传值示例js代码
2013/08/01 Javascript
从零开始做一个pagination分页组件
2017/03/15 Javascript
详解JSONObject和JSONArray区别及基本用法
2017/10/25 Javascript
jQuery实现的监听导航滚动置顶状态功能示例
2018/07/23 jQuery
layer插件select选中默认值的方法
2018/08/14 Javascript
vue视图不更新情况详解
2019/05/16 Javascript
ES6中的class是如何实现的(附Babel编译的ES5代码详解)
2019/05/17 Javascript
详解小程序中h5页面onShow实现及跨页面通信方案
2019/05/30 Javascript
JavaScript设计模式--桥梁模式引入操作实例分析
2020/05/23 Javascript
纯JS开发baguetteBox.js响应式画廊插件
2020/06/28 Javascript
通过实例了解Nodejs模块系统及require机制
2020/07/16 NodeJs
k8s node节点重新加入master集群的实现
2021/02/22 Javascript
python最长回文串算法
2018/06/04 Python
使用Python获取并处理IP的类型及格式方法
2018/11/01 Python
漂亮的Django Markdown富文本app插件的实现
2019/01/02 Python
如何基于Python实现电子邮件的发送
2019/12/16 Python
python实现简单飞行棋
2020/02/06 Python
pycharm安装及如何导入numpy
2020/04/03 Python
使用HTML5的File实现base64和图片的互转
2013/08/01 HTML / CSS
写好求职应聘自荐信的三部曲
2013/09/21 职场文书
大学军训通讯稿
2014/01/13 职场文书
财务人员的自我评价范文
2014/03/03 职场文书
运动会班级口号
2014/06/09 职场文书
运动会标语
2014/06/21 职场文书
乡镇组织委员个人整改措施
2014/09/16 职场文书
2014幼儿园保育员工作总结
2014/11/10 职场文书
小学生五一劳动节演讲稿
2015/03/18 职场文书
交通事故被告答辩状
2015/05/22 职场文书
python中pycryto实现数据加密
2022/04/29 Python