小程序实现列表删除功能


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 相关文章推荐
DLL+ ActiveX控件+WEB页面调用例子
Aug 07 Javascript
用表格输出1-1000之间的数字实现代码(附特效)
Apr 21 Javascript
原生js和jquery实现图片轮播特效
Apr 23 Javascript
jquery实现全选、反选、获得所有选中的checkbox
Sep 13 Javascript
JavaScript定义数组的三种方法(new Array(),new Array('x','y')
Oct 04 Javascript
浅谈jQuery this和$(this)的区别及获取$(this)子元素对象的方法
Nov 29 Javascript
一次围绕setTimeout的前端面试经验分享
Jun 15 Javascript
微信小程序顶部可滚动导航效果
Oct 31 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
Aug 30 Javascript
Vue中axios的封装(报错、鉴权、跳转、拦截、提示)
Aug 20 Javascript
vue组件讲解(is属性的用法)模板标签替换操作
Sep 04 Javascript
多个Vue项目部署到服务器的步骤记录
Oct 22 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输入流php://input使用示例(php发送图片流到服务器)
2013/12/25 PHP
PHP实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
PHP中开启gzip压缩的2种方法
2015/01/31 PHP
php判断两个浮点数是否相等的方法
2015/03/14 PHP
PHP PDO操作MySQL基础教程
2017/06/05 PHP
Javascript 篱式条件判断
2008/08/22 Javascript
修改js Calendar日历控件 兼容IE9/谷歌/火狐
2013/01/04 Javascript
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
JQuery做的一个简单的点灯游戏分享
2014/07/16 Javascript
Javascript检查图片大小不要让大图片撑破页面
2014/11/04 Javascript
JQuery球队选择实例
2015/05/18 Javascript
jQuery与Ajax以及序列化
2016/02/01 Javascript
AngularJS模块详解及示例代码
2016/08/17 Javascript
浅谈Nodejs中的作用域问题
2016/12/26 NodeJs
AngularJS框架的ng-app指令与自动加载实现方法分析
2017/01/04 Javascript
ES6新特性五:Set与Map的数据结构实例分析
2017/04/21 Javascript
vue组件横向树实现代码
2018/08/02 Javascript
vue实现双向绑定和依赖收集遇到的坑
2018/11/29 Javascript
layui弹出框Tab选项卡的示例代码
2019/09/04 Javascript
Vue组件化开发之通用型弹出框的实现
2020/02/28 Javascript
python 迭代器和iter()函数详解及实例
2017/03/21 Python
Python 获取中文字拼音首个字母的方法
2018/11/28 Python
关于不懂Chromedriver如何配置环境变量问题解决方法
2019/06/12 Python
使用python绘制cdf的多种实现方法
2020/02/25 Python
Python是怎样处理json模块的
2020/07/16 Python
Python3 ffmpeg视频转换工具使用方法解析
2020/08/10 Python
pycharm 代码自动补全的实现方法(图文)
2020/09/18 Python
python 星号(*)的多种用途
2020/09/21 Python
Python字符串查找基本操作代码案例
2020/10/27 Python
演讲比赛策划方案
2014/06/11 职场文书
食品委托检验协议书范本
2014/09/12 职场文书
单位法定代表人授权委托书
2014/09/20 职场文书
给老婆道歉的话
2015/01/20 职场文书
Tomcat用户管理的优化配置详解
2022/03/31 Servers
CSS的calc函数用法小结
2022/06/25 HTML / CSS
postgresql如何找到表中重复数据的行并删除
2023/05/08 MySQL