小程序实现列表删除功能


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+dom树型菜单类,希望朋友们一起进步
May 03 Javascript
通过Unicode转义序列来加密,按你说的可以算是混淆吧
May 06 Javascript
js 颜色选择器(兼容firefox)
Mar 05 Javascript
javascript中Function类型详解
Apr 28 Javascript
Javascript实现前端简单的路由实例
Sep 11 Javascript
Vue.js组件tree实现省市多级联动
Dec 02 Javascript
JavaScript获取键盘按键的键码(参照表)
Jan 10 Javascript
Vue AST源码解析第一篇
Jul 19 Javascript
微信小程序实现简单跑马灯效果
May 26 Javascript
Vue组件的使用及个人理解与介绍
Feb 09 Javascript
详解在IDEA中将Echarts引入web两种方式(使用js文件和maven的依赖导入)
Jul 11 Javascript
Vue基本指令实例图文讲解
Feb 25 Vue.js
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 CURL模拟GET及POST函数代码
2010/04/25 PHP
PHP文件读写操作之文件写入代码
2011/01/13 PHP
php封装的smarty类完整实例
2016/10/19 PHP
php中的explode()函数实例介绍
2019/01/18 PHP
JS创建优美的页面滑动块效果 - Glider.js
2007/09/27 Javascript
执行iframe中的javascript方法
2008/10/07 Javascript
基于JQUERY的多级联动代码
2012/01/24 Javascript
js播放wav文件(源码)
2013/04/22 Javascript
JS实现拖动示例代码
2013/11/01 Javascript
面向对象设计模式的核心法则
2013/11/10 Javascript
Jquery如何实现点击时高亮显示代码
2014/01/22 Javascript
判断在css加载完毕后执行后续代码示例
2014/09/03 Javascript
深入理解JavaScript编程中的原型概念
2015/06/25 Javascript
js实现兼容性好的微软官网导航下拉菜单效果
2015/09/07 Javascript
使用Dropzone.js上传的示例代码
2017/10/10 Javascript
详解用Node.js写一个简单的命令行工具
2018/03/01 Javascript
JavaScript中字符串的常用操作方法及特殊字符
2018/03/18 Javascript
Vue3.0 响应式系统源码逐行分析讲解
2019/10/14 Javascript
Python的Django应用程序解决AJAX跨域访问问题的方法
2016/05/31 Python
Python爬虫实现爬取京东手机页面的图片(实例代码)
2017/11/30 Python
matplotlib中legend位置调整解析
2017/12/19 Python
100行Python代码实现自动抢火车票(附源码)
2018/01/11 Python
django中send_mail功能实现详解
2018/02/06 Python
Linux 修改Python命令的方法示例
2018/12/03 Python
Python使用POP3和SMTP协议收发邮件的示例代码
2019/04/16 Python
Pycharm远程调试原理及具体配置详解
2019/08/08 Python
Python使用requests xpath 并开启多线程爬取西刺代理ip实例
2020/03/06 Python
pandas DataFrame 数据选取,修改,切片的实现
2020/04/24 Python
如何使用python socket模块实现简单的文件下载
2020/09/04 Python
html5 canvas fillRect坐标和大小的问题解决方法
2014/03/26 HTML / CSS
金属材料工程个人求职的自我评价
2013/12/04 职场文书
教师节标语大全
2014/10/07 职场文书
2014年效能监察工作总结
2014/11/21 职场文书
2015年大学组织委员个人工作总结
2015/10/23 职场文书
搞笑婚礼主持词开场白
2015/11/24 职场文书
go 实现简易端口扫描的示例
2021/05/22 Golang