zoukankan      html  css  js  c++  java
  • VUE: 移动端长按弹出确认删除地址(2)

      之前有一篇文章也写了长按弹出确认框的功能,在android机上测试过完全没问题,到后面整体测试时发现IOS这个功能长按移除就消失了,

    除非长按不松手,用另外一只手点击确定才能完成操作,所以这次做了修改,IOS和android亲测有效哦~

    CSS:
    <li v-for="(item,idx) in addressList" :key="idx" @touchstart="longPress" @touchend="removePress(item)" @click="chooseAddress(item)">
    JS:
    // 删除地址,长按开始
    longPress () {
      this.touchstartTime = new Date().getTime()
    },
    // 删除地址,长按结束
    removePress (item) {
      this.touchendTime = new Date().getTime()
      this.duration = this.touchendTime - this.touchstartTime
      if (this.duration >= 800) {
        MessageBox.confirm('确认删除吗?').then(res => {
          this.addressList.splice(item, 1)
          toast('删除成功~')
        }).catch(() => {
        })
      }
    } 
    JS: 接好后端接口时的数据
    // 删除地址,长按开始
    longPress () {
      this.touchstartTime = new Date().getTime()
    },
    // 删除地址,长按结束
    removePress (item) {
      this.touchendTime = new Date().getTime()
      this.duration = this.touchendTime - this.touchstartTime
      if (this.duration >= 800) {
        MessageBox.confirm('确认删除吗?').then(res => {
          let _formData = {
            cusmallToken: getStore('cusmallToken'),
            addressId: item.id
          }
          commonDkApiFun(_formData, '/ttmb/api/member/delAddress').then(res => {
            if (res.data.ret === 0) {
              this.addressList.splice(item, 1)
              this.getAddressList()
              Toast('删除成功')
            }
          }).catch(err => {
            console.log(err)
          })
        }).catch(() => {
        })
      }
    }
  • 相关阅读:
    浮点型float
    Linux时间同步命令
    四层负载均衡和七层负载均衡的区别
    Linux下把Mysql和Apache加入到系统服务里
    Linux下Nagios的安装与配置
    Linux是怎么启动的(整理)
    centos 双网卡 eth0 eth1 配置
    MYSQL的常用命令和增删改查语句和数据类型
    CentOS 下如何修改 MySQL 的密码
    mysql unrecognized service问题解决
  • 原文地址:https://www.cnblogs.com/Awen71815iou/p/11570747.html
Copyright © 2011-2022 走看看