微信小程序杂章

1.报错

• 问题描述：

tunneling socket could not be established

• 解决方法：

关闭代理，不要使用代理上网

2.兼容性

• 问题描述：iOS中滚动卡顿
• 解决方法：

设置-webkit-overflow-scrolling:touch;

3.小程序长按事件触发点击事件的BUG处理

• 长按事件(longtap)必触发点击事件(tap)的BUG
• 解决方法

//wxml
<view>
  <button bindtap="tap" bindlongtap="longtap" bindtouchend="touchend" >长按我<button>
<view>

//js
Page({
  data: {
    lock: false
  },
  tap: function() {
    //检查锁
    if (this.data.lock) {
      return;
    }
    console.log('触发了 tap')
  },
  touchend: function() {
    if (this.data.lock) {
      //开锁
      setTimeout(() => {
        this.setData({ lock: false });
      }, 100);
    }
  },
  longtap: function () {
    //锁住
    this.setData({lock: true});
    console.log('触发了 longtap')
  }
})

4.微信小程序:冒泡事件及其阻止

• 冒泡处理
• 解决方法：

利用catch+事件名（例如：catchtap），阻止冒泡

/*
 * 事件的类别分为几种：
 *   点击事件：tap
 *   长按事件：longtap
 *   触摸事件：touchstart； touchend；touchcancel；touchmove
 *   其他：input；submit....
 * 其中前三类是冒泡事件，其他的称为非冒泡事件。
*/
<view class='redview' bindtap='redclick'>
  红色
  <view class='yellowview' bindtap='yellowclick'>
    黄色
    <view class='blueview' catchtap='blueclick'>
      蓝色
    </view>
  </view>
</view>