微信小程序遇到的问题总结

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/mr_wuch/article/details/59539008

1、事件

问题描述：本来想点击的时候去做某些事情，长按的时候去做另一些事情，然而发现长按事件执行之后触发了点击tap的事件。。。

然后测试了小程序的事件流程，单击、双击、长按最终都会触发tap，呵呵呵呵。。。

解决方案：通过触摸事件来进行判断是执行tap的事件还是longtap的事件（我要这longtap有何用？？？还是要自己通过触摸时间来判断）

Page({
  data: {
    loanNum: null, 
    loanName: null, 
    files: [],
    imgTouchStartTime: null,
    imgTouchEndTime: null
  },
  onLoad: function (options) {
    // 生命周期函数--监听页面加载
    this.setData({
      loanNum: options.loannum,
      loanName: options.loanname
    })
  },
  onReady: function () {
    // 生命周期函数--监听页面初次渲染完成

  },
  onShow: function () {
    // 生命周期函数--监听页面显示

  },
  onHide: function () {
    // 生命周期函数--监听页面隐藏

  },
  onUnload: function () {
    // 生命周期函数--监听页面卸载

  },
  onPullDownRefresh: function () {
    // 页面相关事件处理函数--监听用户下拉动作

  },
  onReachBottom: function () {
    // 页面上拉触底事件的处理函数

  },
  onShareAppMessage: function () {
    // 用户点击右上角分享
    return {
      title: 'title', // 分享标题
      desc: 'desc', // 分享描述
      path: 'path' // 分享路径
    }
  },
  chooseImage: function (e) {
    var that = this;
    wx.chooseImage({
      count: 5, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: function (res) {
        console.log(res)
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths // 数组类型
        that.setData({
          files: that.data.files.concat(tempFilePaths)
        })
        wx.uploadFile({
          url: 'https://String',
          filePath: 'tempFilePaths[0]', // 要上传文件资源的路径
          name: 'confirmImg',
          header: { // 设置请求的 header
            "Content-Type": "multipart/form-data"
          },
          // formData: {}, // HTTP 请求中其他额外的 form data
          success: function (res) {
            // success
          },
          fail: function () {
            // fail
          },
          complete: function () {
            // complete
          }
        })
      },
      fail: function () {

      }
    })
  },
  imgTap: function (e) {
    console.log(e.currentTarget.dataset.src);
    var that = this;
    var touchTime = this.data.imgTouchEndTime - this.data.imgTouchStartTime;
    console.log(touchTime)
    if (touchTime < 350) { // 单机预览
      wx.previewImage({
        current: e.currentTarget.dataset.src, // 当前显示图片的http链接
        urls: this.data.files // 需要预览的图片http链接列表
      });
    } else { // 长按删除
      wx.showModal({
        title: '提示',
        content: '确定要删除这张图片吗？',
        success: function (res) {
          if (res.confirm) {
            console.log('用户点击确定')
          }
        }
      })
    }

  },
  imgTouchStart: function (e) {
    this.setData({
      imgTouchStartTime: e.timeStamp
    })
  },
  imgTouchEnd: function (e) {
    this.setData({
      imgTouchEndTime: e.timeStamp
    })
  }
})

2、图片上传