微信小程序开发中遇到的问题及解决办法（一）

一、整个页面覆盖的自定义弹窗，滑动弹窗中的内容，页面内容也会滑动。若是快速滚动弹窗，页面内容和弹窗中的内容有时会错乱。这个问题大多出如今苹果手机上，相似事件事件穿透的效果。

自定义弹窗截图以下：

解决办法：再最外层元素上添加事件：catch:touchmove="notDo"
事件代码：

/**
   * @desc not do
   */
  notDo: function () {
    // not do
  }

wxml截图：

注意：加上这个事件后，对侧滑效果有所影响，若是须要侧滑切换页面，建议使用其余方法。

二、使用了fixed定位的元素，会出现随页面滚动而移动的现象。社区中的说法大概是：这个是由于小程序架构的缘由致使 scroll 事件有必定的延迟，最终使 fixed 的改变不够及时致使的。
解决办法：在fixed定位的元素上，添加样式：transform: translate3d(0, 0, 0);

三、使用canvas绘制分享图，有的时候绘制错误，致使整张分享图空白。
折中解决办法：隐藏canvas，使用html结构，从新渲染分享图。这样方便找出究竟是哪里绘制错误却是整张图绘制不出来，也会有更好的交互效果。还有一点好处，若是分享图只有一屏的内容，能够直接截图分享（若是是苹果，不支持截长图）。

注意：若是分享图中并无大量的动态内容，并不建议使用这种折中方案。由于这须要维护两套代码，并且当html结构渲染出来的时候，canvas可能还未绘制完毕或者绘制错误，会误导用户操做。

截图：

四、开发者工做模拟小程序不一样进入场景，好比：扫描二维码，长按识别二维码的启动参数处理。

解决办法：应该经过encodeURIComponent来编码启动参数，在当前页面获取页面参数的时候，再经过decodeURIComponent来解码。
截图：

代码截图：

注意：区别于encodeURI和decodeURI的编解码，encodeURIComponent和decodeURIComponent的组合使用范围更广。encodeURI对在 URI 中具备特殊含义的 ASCII 标点符号，不会进行转义的：;/?:@&=+$,#, 而encodeURIComponent会转义这些。赶上encodeURI不会转义的标点符号，URI会直接被截取掉。

随记：最近，太阳再也不流浪；最近，想碰见更好的本身~