小程序实现列表删除功能


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 相关文章推荐
JQuery 图片延迟加载并等比缩放插件
Nov 09 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
js 弹出框只弹一次(二次修改之后的)
Nov 26 Javascript
iframe里面的元素触发父窗口元素事件的jquery代码
Oct 19 Javascript
js实现对table动态添加、删除和更新的方法
Feb 10 Javascript
vue-router2.0 组件之间传参及获取动态参数的方法
Nov 10 Javascript
利用JS判断客户端类型你应该知道的四种方法
Dec 22 Javascript
详解vue-router 命名路由和命名视图
Jun 01 Javascript
jQuery选择器之基本选择器用法实例分析
Feb 19 jQuery
node.js基于socket.io快速实现一个实时通讯应用
Apr 23 Javascript
vue使用swiper实现左右滑动切换图片
Oct 16 Javascript
解决Vue watch里调用方法的坑
Nov 07 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
《神奇女侠:血脉》神力女超人大战犯罪公司
2020/04/09 欧美动漫
php+mongodb判断坐标是否在指定多边形区域内的实例
2016/10/28 PHP
php提交表单时保留多个空格及换行的文本样式的方法
2017/06/20 PHP
PHP设计模式之工厂模式实例总结
2017/09/01 PHP
laravel5 Eloquent 实现事务方式
2019/10/21 PHP
PHP实现长轮询消息实时推送功能代码实例讲解
2021/02/26 PHP
js 获取浏览器高度和宽度值(多浏览器)
2009/09/02 Javascript
JavaScript与DropDownList 区别分析
2010/01/01 Javascript
如何解决Jquery库及其他库之间的$命名冲突
2013/09/15 Javascript
jQuery对下拉框,单选框,多选框的操作
2014/02/21 Javascript
js函数内变量的作用域分析
2015/01/12 Javascript
本人自用的global.js库源码分享
2015/02/28 Javascript
javascript 闭包详解及简单实例应用
2016/12/31 Javascript
jquery实现刷新随机变化样式特效(tag标签样式)
2017/02/03 Javascript
js实现3D图片展示效果
2017/03/09 Javascript
JS简单实现数组去重的方法示例
2017/03/27 Javascript
JavaScript 事件流、事件处理程序及事件对象总结
2017/04/01 Javascript
webpack4.0打包优化策略整理小结
2018/03/30 Javascript
javascript定时器的简单应用示例【控制方块移动】
2019/06/17 Javascript
基于Vue el-autocomplete 实现类似百度搜索框功能
2019/10/25 Javascript
[01:59]游戏“zheng”当时试玩会
2019/08/21 DOTA
python实现可以断点续传和并发的ftp程序
2016/09/13 Python
Flask 让jsonify返回的json串支持中文显示的方法
2018/03/26 Python
Pycharm+django2.2+python3.6+MySQL实现简单的考试报名系统
2019/09/05 Python
Python 用三行代码提取PDF表格数据
2019/10/13 Python
Python函数的定义方式与函数参数问题实例分析
2019/12/26 Python
Pytorch 实现权重初始化
2019/12/31 Python
css实例教程 一款纯css3实现的超炫动画背画特效
2014/11/05 HTML / CSS
大学生职业生涯规划书范文
2014/01/14 职场文书
家长学校实施方案
2014/03/15 职场文书
超市创业计划书
2014/04/24 职场文书
单方离婚协议书范本(2014版)
2014/09/30 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
高校自主招生自荐信2015
2015/03/04 职场文书
大学自主招生自荐信(2016精选篇)
2016/01/28 职场文书
100句人生哲理语录集锦:强者征服今天,懒汉坐等明天
2019/10/18 职场文书