小程序实现列表删除功能


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 checkbox 全选/反选及批量删除
Apr 28 Javascript
javascript的函数、创建对象、封装、属性和方法、继承
Mar 10 Javascript
简单实用的反馈表单无刷新提交带验证
Nov 15 Javascript
JavaScript实现在数组中查找不同顺序排列的字符串
Sep 26 Javascript
javascript中定义类的方法汇总
Dec 28 Javascript
使用javascript将时间转换成今天,昨天,前天等格式
Jun 25 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
jQuery中each循环的跳出和结束实例
Aug 16 jQuery
vue项目tween方法实现返回顶部的示例代码
Mar 02 Javascript
JavaScript中的函数申明、函数表达式、箭头函数
Dec 06 Javascript
Node.js 在本地生成日志文件的方法
Feb 07 Javascript
vue实现简单学生信息管理
May 30 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
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
PHP开发环境配置(MySQL数据库安装图文教程)
2010/04/28 PHP
PHP+Mysql实现多关键字与多字段生成SQL语句的函数
2014/11/05 PHP
php实现压缩多个CSS与JS文件的方法
2014/11/11 PHP
PHP实现微信商户支付企业付款到零钱功能
2018/09/30 PHP
用JS控制回车事件的代码
2011/02/20 Javascript
JS实现定时页面弹出类似QQ新闻的提示框
2013/11/07 Javascript
Javascript实现返回上一页面并刷新的小例子
2013/12/11 Javascript
javascript获取重复次数最多的字符
2015/07/08 Javascript
javascript实现类似java中getClass()得到对象类名的方法
2015/07/27 Javascript
jQuery使用Selectator插件实现多选下拉列表过滤框(附源码下载)
2016/04/08 Javascript
AJAX实现瀑布流触发分页与分页触发瀑布流的方法
2016/05/23 Javascript
BootStrap中Table分页插件使用详解
2016/10/09 Javascript
vue路由拦截及页面跳转的设置方法
2018/05/24 Javascript
高性能js数组去重(12种方法,史上最全)
2019/12/21 Javascript
vue 通过绑定事件获取当前行的id操作
2020/07/27 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
2020/11/27 Vue.js
Python ftp上传文件
2016/02/13 Python
Python设计实现的计算器功能完整实例
2017/08/18 Python
Pycharm简单使用教程(入门小结)
2019/07/04 Python
python计算无向图节点度的实例代码
2019/11/22 Python
Python实现汇率转换操作
2020/05/03 Python
7 For All Mankind官网:美国加州洛杉矶的高级牛仔服装品牌
2018/12/20 全球购物
HEMA法国:荷兰原创设计
2019/02/21 全球购物
荷兰最大的儿童服装店:The Kids Republic
2019/04/13 全球购物
俄罗斯购买内衣网站:Trusiki
2020/08/22 全球购物
给水排水工程专业毕业生推荐信
2013/10/28 职场文书
学前教育毕业生自荐信
2013/10/29 职场文书
祖国在我心中演讲稿300字
2014/05/04 职场文书
关于读书的演讲稿
2014/05/07 职场文书
个人投资合作协议书
2014/10/12 职场文书
教师党员自我评议不足范文
2014/10/19 职场文书
2015年暑期社会实践总结
2015/07/13 职场文书
家庭教育培训学习心得体会
2016/01/14 职场文书
win10蓝屏0xc0000001安全模式进不了怎么办?win10出现0xc0000001的解决方法
2022/08/05 数码科技
Vue Element plus使用方法梳理
2022/12/24 Vue.js