小程序实现列表删除功能


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 相关文章推荐
限制文本字节数js代码
Mar 06 Javascript
文本框只能选择数据到文本框禁止手动输入
Nov 22 Javascript
JS实现一个列表中包含上移下移删除等功能
Sep 24 Javascript
javascript实现微信分享
Dec 23 Javascript
简单理解JavaScript中的封装与继承特性
Mar 19 Javascript
JS打印组合功能
Aug 04 Javascript
Jquery EasyUI Datagrid右键菜单实现方法
Dec 30 Javascript
最常见和最有用的字符串相关的方法详解
Feb 06 Javascript
深入理解Vue.js源码之事件机制
Sep 27 Javascript
在 React、Vue项目中使用SVG的方法
Feb 09 Javascript
JS关于刷新页面的相关总结
May 09 Javascript
mpvue 单文件页面配置详解
Dec 02 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数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
基于thinkPHP框架实现留言板的方法
2016/10/17 PHP
非常好的js代码
2006/06/27 Javascript
JSON 学习之完全手册 图文
2007/05/29 Javascript
利用JS重写Cognos右键菜单的实现代码
2010/04/11 Javascript
jQuery EasyUI API 中文文档 - TimeSpinner时间微调器
2011/10/23 Javascript
ASP.NET jQuery 实例18 通过使用jQuery validation插件校验DropDownList
2012/02/03 Javascript
javaScript函数中执行C#代码中的函数方法总结
2013/08/07 Javascript
使用javascript获取页面名称
2014/12/23 Javascript
详解JavaScript正则表达式中的global属性的使用
2015/06/16 Javascript
jquery实现简单的轮换出现效果实例
2015/07/23 Javascript
AngularJS 模块化详解及实例代码
2016/09/14 Javascript
JavaScript重定向URL参数的两种方法小结
2016/10/19 Javascript
Bootstrap基本插件学习笔记之Tooltip提示工具(18)
2016/12/08 Javascript
BootStrap Datetimepicker 汉化的实现代码
2017/02/10 Javascript
H5实现仿flash效果的实现代码
2017/09/29 Javascript
Vue2.0系列之过滤器的使用
2018/03/01 Javascript
jQuery实现table表格信息的展开和缩小功能示例
2018/07/21 jQuery
vue中当图片地址无效的时候,显示默认图片的方法
2018/09/18 Javascript
vue动态禁用控件绑定disable的例子
2019/10/28 Javascript
Vue 设置axios请求格式为form-data的操作步骤
2019/10/29 Javascript
[05:07]DOTA2英雄梦之声_第14期_暗影恶魔
2014/06/20 DOTA
[26:52]LGD vs EG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
python通过urllib2爬网页上种子下载示例
2014/02/24 Python
Python时间模块datetime、time、calendar的使用方法
2016/01/13 Python
Python中的defaultdict与__missing__()使用介绍
2018/02/03 Python
python获取文件真实链接的方法,针对于302返回码
2018/05/14 Python
在python中将字符串转为json对象并取值的方法
2018/12/31 Python
css3 边框、背景、文本效果的实现代码
2018/03/21 HTML / CSS
详解HTML5 LocalStorage 本地存储
2016/12/23 HTML / CSS
财务工作个人求职的自我评价
2013/12/19 职场文书
培训演讲稿范文
2014/01/12 职场文书
出生公证委托书
2014/04/03 职场文书
学雷锋活动总结范文
2014/04/25 职场文书
艺术设计专业毕业生推荐信
2014/07/08 职场文书
辞职离别感言
2015/08/04 职场文书