小程序实现列表删除功能


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 SELECT单选模拟jQuery.select.js
Nov 12 Javascript
jquery 多行文本框(textarea)高度变化
Jul 03 Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
Dec 22 Javascript
jquery动画效果学习笔记(8种效果)
Nov 13 Javascript
JavaScript判断DIV内容是否为空的方法
Jan 29 Javascript
JavaScript获取ul中li个数的方法
Feb 13 Javascript
JavaScript全屏和退出全屏事件总结(附代码)
Aug 17 Javascript
vue集成chart.js的实现方法
Aug 20 Javascript
layer.open提交子页面的form和layedit文本编辑内容的方法
Sep 27 Javascript
JS document form表单元素操作完整示例
Jan 13 Javascript
es6数组之扩展运算符操作实例分析
Apr 25 Javascript
前端 javascript 实现文件下载的示例
Nov 24 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
德生PL450的电路分析和低放电路的改进办法
2021/03/02 无线电
压力如何影响浓缩咖啡品质
2021/03/03 咖啡文化
PHP.MVC的模板标签系统(二)
2006/09/05 PHP
PHP入门速成教程
2007/03/19 PHP
destoon设置自定义搜索的方法
2014/06/21 PHP
详解PHP实现执行定时任务
2015/12/21 PHP
curl 出现错误的调试方法(必看)
2017/02/13 PHP
基于Laravel 5.2 regex验证的正确写法
2019/09/29 PHP
jquery实现表单验证并阻止非法提交
2015/07/09 Javascript
微信小程序 教程之小程序配置
2016/10/17 Javascript
Windows系统下安装Node.js的步骤图文详解
2016/11/15 Javascript
关于Node.js中Buffer的一些你可能不知道的用法
2017/03/28 Javascript
详谈angularjs中路由页面强制更新的问题
2017/04/24 Javascript
JS调用安卓手机摄像头扫描二维码
2018/10/16 Javascript
Vue.js中该如何自己维护路由跳转记录
2019/05/19 Javascript
微信小程序本地存储实现每日签到、连续签到功能
2019/10/09 Javascript
JS桶排序的简单理解与实现方法示例
2019/11/25 Javascript
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
2020/02/04 jQuery
Python自动重试HTTP连接装饰器
2015/04/28 Python
Python脚本实现自动发带图的微博
2016/04/27 Python
在Python的一段程序中如何使用多次事件循环详解
2017/09/07 Python
解决Pycharm调用Turtle时 窗口一闪而过的问题
2019/02/16 Python
利用Python实现kNN算法的代码
2019/08/16 Python
python numpy生成等差数列、等比数列的实例
2020/02/25 Python
解决tensorflow读取本地MNITS_data失败的原因
2020/06/22 Python
canvas如何绘制钟表的方法
2017/12/13 HTML / CSS
保时捷设计:Porsche Design
2019/03/30 全球购物
Lookfantastic澳大利亚官网:英国知名美妆购物网站
2021/01/07 全球购物
总裁办公室主任职责
2014/01/02 职场文书
企业军训感言
2014/02/08 职场文书
初中学习计划书范文
2014/09/15 职场文书
成本会计岗位职责
2015/02/03 职场文书
出国留学英文自荐信
2015/03/25 职场文书
总经理司机岗位职责
2015/04/10 职场文书
运动会主持人开幕词
2016/03/04 职场文书
vue使用echarts实现折线图
2022/03/21 Vue.js