小程序实现列表删除功能


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有关的小细节
Apr 02 Javascript
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
Jun 28 Javascript
理解jQuery stop()方法
Nov 21 Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
Dec 27 Javascript
jQuery扇形定时器插件pietimer使用方法详解
Jul 18 jQuery
zTree获取当前节点的下一级子节点数实例
Sep 05 Javascript
jquery 输入框查找关键字并提亮颜色的实例代码
Jan 23 jQuery
Vue2.0 实现歌手列表滚动及右侧快速入口功能
Aug 08 Javascript
详解react-refetch的使用小例子
Feb 15 Javascript
解决layer.open弹出框不能获取input框的值为空的问题
Sep 10 Javascript
JS页面动态绘图工具SVG,Canvas,VML介简介
Oct 16 Javascript
Vue深入理解插槽slot的使用
Aug 05 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
杏林同学录(二)
2006/10/09 PHP
php木马攻击防御之道
2008/03/24 PHP
在windows服务器开启php的gd库phpinfo中未发现
2013/01/13 PHP
php实现按照权重随机排序数据的方法
2015/01/09 PHP
php设计模式之委托模式
2016/02/13 PHP
PHP7 新特性详细介绍
2016/09/06 PHP
Laravel使用支付宝进行支付的示例代码
2017/08/16 PHP
Laravle eloquent 多对多模型关联实例详解
2017/11/22 PHP
用javascript实现读取txt文档的脚本
2007/07/20 Javascript
JavaScript更改class和id的方法
2008/10/10 Javascript
给html超链接设置事件不使用href来完成跳
2014/04/20 Javascript
Web表单提交之disabled问题js解决方法
2015/01/13 Javascript
JavaScript时间转换处理函数
2015/04/14 Javascript
js获取客户端操作系统类型的方法【测试可用】
2016/05/27 Javascript
vue下拉菜单组件(含搜索)的实现代码
2018/11/25 Javascript
JS实现的合并两个有序链表算法示例
2019/02/25 Javascript
解决layui 三级联动下拉框更新时回显的问题
2019/09/03 Javascript
element-ui点击查看大图的方法示例
2020/12/14 Javascript
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
Python爬虫爬验证码实现功能详解
2016/04/14 Python
利用python生成一个导出数据库的bat脚本文件的方法
2016/12/30 Python
利用python实现xml与数据库读取转换的方法
2017/06/17 Python
Python线性回归实战分析
2018/02/01 Python
Python爬虫之正则表达式基本用法实例分析
2018/08/08 Python
详谈Python 窗体(tkinter)表格数据(Treeview)
2018/10/11 Python
python实现QQ空间自动点赞功能
2019/04/09 Python
纯CSS3实现扇形动画菜单(简化版)实例源码
2017/01/17 HTML / CSS
优秀辅导员事迹材料
2014/02/16 职场文书
经典毕业生求职信
2014/07/12 职场文书
师德师风的心得体会
2014/09/02 职场文书
商超业务员岗位职责
2015/02/13 职场文书
承诺保证书格式
2015/02/28 职场文书
建筑质检员岗位职责
2015/04/08 职场文书
《自然之道》读后感3篇
2019/12/17 职场文书
Win11 Build 21996.1 Dev版怎么样? win11系统截图欣赏
2021/11/21 数码科技
Win11 Beta 预览版 22621.575 和 22622.575更新补丁KB5016694发布(附更新内容大全)
2022/08/14 数码科技