小程序循环列表删除当前选中列表的方法

简介: 小程序循环列表删除当前选中列表的方法

需求:点击解绑按钮的时候,会删除当前所点击的列表.

点击试驾按钮的时候,左侧的图标会变成按钮一样的颜色。

代码片段:

删除和试驾的方法

wxml:

<view class="inner del">
          <span class="draw" data-index="{{index}}" data-name="{{item.carNum}}" bindtap="tryDriver" >试驾</span>
          <span class="delete" data-name="{{item.carNum}}" bindtap="unBind">解绑</span>
 </view>

js:

 //点击删除
  unBind: function(e) {
    var that = this;
    console.log(e.currentTarget.dataset.name)
    //获取列表中要删除项的下标
    wx.showModal({
      title: '提示',
      content: '是否确认解绑',
      success(res) {
        if (res.confirm) {
          //解绑
          wx.request({
            url: app.globalData.root +"car/unBind.do",
            data: {
              "openid": app.globalData.openid,
              "carNum": e.currentTarget.dataset.name
            },
            method: 'GET',
            header: {
              'Content-type': 'application/json'
            },
            success: function(res) {
              that.getCars(app.globalData.openid);
            }
          });
        }
      }
    })
  },
  //点击试驾
  tryDriver: function(e) {
    var that = this;
    var index = e.currentTarget.dataset.index;
    var list = that.data.carList;
    if (list[index].state == 5)
      return;
    wx.showModal({
      title: '提示',
      content: '是否确认试驾',
      success(res) {
        if (res.confirm) {
          //试驾
          wx.request({
            url: app.globalData.root +"car/driver.do",
            data: {
              "openid": app.globalData.openid,
              "carNum": e.currentTarget.dataset.name
            },
            method: 'GET',
            header: {
              'Content-type': 'application/json'
            },
            success: function(res) {
              if(res.data == 0){
                wx.showToast({
                  title: '车辆维修尚未结束、不可试驾',
                  icon: 'none',
                })
                return;
              }
              //切换图标
              for (var ix in list) {
                if (ix == index)
                  list[ix].state = 5;
              }
              //更新列表的状态
              that.setData({ 
                carList: list
              });
            }
          });
        }
      }
    })
  },
相关文章
|
3月前
|
小程序
|
3月前
|
编解码 小程序
微信小程序11177版本开启控制台方法
微信小程序11177版本开启控制台方法
家政服务小程序APP开发,做好上门家政最快的方法是什么?
在家政服务领域,打造成功的平台并非易事。本文分享了三个关键步骤:避免初期盲目投入、采用低成本获客方式、建立有效的阿姨筛选机制。遵循这些方法,可助你避开常见陷阱,成为行业头部平台。
|
3月前
|
缓存 小程序 数据库
小程序页面之间(传值)传递数据的方法
小程序页面之间(传值)传递数据的方法
187 63
|
2月前
|
小程序
小程序消除图片下边距的三个方法
小程序消除图片下边距的三个方法
49 11
|
2月前
|
小程序 前端开发 索引
微信小程序中的条件渲染和列表渲染,wx:if ,wx:elif,wx:else,wx:for,wx:key的使用,以及block标记和hidden属性的说明
这篇文章介绍了微信小程序中条件渲染和列表渲染的使用方法,包括wx:if、wx:elif、wx:else、wx:for、wx:key以及block标记和hidden属性的使用。
微信小程序中的条件渲染和列表渲染,wx:if ,wx:elif,wx:else,wx:for,wx:key的使用,以及block标记和hidden属性的说明
|
3月前
|
小程序 JavaScript
微信小程序中的页面跳转(通过点击按钮、调用方法的形式)
这篇文章讲解了微信小程序中页面跳转的方法,包括使用按钮点击事件和调用方法实现跳转,以及推荐使用`this.pageRouter.navigateTo`代替`wx.navigateTo`的方式。
微信小程序中的页面跳转(通过点击按钮、调用方法的形式)
|
3月前
|
小程序 安全
Fiddler抓取小程序后端请求导入AppScan扫描快捷方法
【8月更文挑战第26天】这是一种利用 Fiddler 捕获小程序后端请求并导入 AppScan 进行安全扫描的方法。首先安装配置 Fiddler 并设置手机代理,通过 Fiddler 捕获请求;接着导出这些请求为 .saz 文件,并在 AppScan 中导入此文件,配置扫描参数后启动扫描以检测安全漏洞。操作时需确保有合法授权并遵循相关法规。尽管不同版本软件操作细节可能有所不同,但整体流程类似。
136 1
|
3月前
|
小程序 JavaScript API
小程序实现分享的三种方法
【8月更文挑战第20天】
|
4月前
|
小程序
微信小程序APPID的两种查看方法
查看微信小程序APPID的两种方法:1) 在小程序内点击右上角“...”,进入查看页面,点击“更多资料”查看;2) 登录微信公众平台([https://mp.weixin.qq.com/](https://mp.weixin.qq.com/)),进入【设置】查看“账号信息”。
3064 1