keng42

Appearance

On this page

有些时间浪费了是没有意义的。

Q:
微信小程序引入 bluebird 后在安卓机调试报错

bash
TypeError: Cannot read property 'createElement' of undefined

A:
通过查看 bluebird 源码发现，其中有关于对 dom 操作的代码，导致在小程序中跑不通。
找一个轻量级、只包含 promise 异步的核心代码的 promise 库 es-6.promise.min.js 来引入。
S: 微信小程序引入promise相关库及安卓真机报错解决方案

Q: Docker 中跑 nginx 挂载的时候各种问题
A:
正确挂载方式：

bash
docker run -p 80:80 -p 443:443 \
-v ~/Docker/nginx/nginx/nginx.conf:/etc/nginx/nginx.conf \
-v ~/Docker/nginx/nginx/conf.d:/etc/nginx/conf.d \
-v ~/Docker/nginx/logs:/etc/nginx/logs \
-v ~/Public:/public \
--name mynginx nginx
  1. 需要事先创建 ~/Docker/nginx/nginx/nginx.conf 文件
  2. /etc/nginx/conf.d 是自定义的服务器配置文件
  3. Linux 下 nginx 日志文件夹路径 /etc/nginx/logs

Q: wxml 和 wxss 语法高亮格式化问题 A: 修改 Atom 配置文件 config.cson

core:
  customFileTypes:
    "source.css": [
      "wxss"
    ]
    "text.html.basic": [
      "wxml"
    ]

Q: wxml 代码段
A: 修改 Atom 配置文件 snippets.cson

".text.html.basic":
  # wxml attribute
  'wxml class attribute':
    'prefix': 'wxclass'
    'body': 'class="$1"'

  'wxml hidden attribute':
    'prefix': 'wxhidden'
    'body': 'hidden="$1"'

  'wxml bindchange attribute':
    'prefix': 'wxbindchange'
    'body': 'bindchange="$1"'

  'wxml bindtap attribute':
    'prefix': 'wxbindtap'
    'body': 'bindtap="$1"'

  'wxml style attribute':
    'prefix': 'wxstyle'
    'body': 'style="$1"'

  # wxml elements
  'wxml View':
    'prefix': 'wxview'
    'body': '<view class="$1">\n\t$2\n</view>$0'

  'wxml Scroll View':
    'prefix': 'wxscroll'
    'body': """
      <scroll-view class="$1" scroll-x="$2" scroll-y="$3" upper-threshold="$4" lower-threshold="$5" bindscrolltoupper="$6"
        bindscrolltolower="$7" bindscroll="$8" scroll-into-view="{{$9}}">\n\t$10\n</scroll-view>$0
    """

  'wxml Swiper':
    'prefix': 'wxswiper'
    'body': """
      <swiper indicator-dots="{{$1}}" autoplay="{{$2}}" current="{{$3}}" interval="{{$4}}" duration="{{$5}}" bindchange="{{$6}}">
        <block wx:for="{{$7}}">
          <swiper-item>
            <image src="{{$8}}" class="" width="" height=""/>
          </swiper-item>
        </block>
      </swiper>
    """

  'wxml Icon':
    'prefix': 'wxicon'
    'body': '<icon type="{{$1}}" size="{{$2}}" color="{{$3}}"/>$0'

  'wxml Text':
    'prefix': 'wxtext'
    'body': '<text>$1</text>$0'

  'wxml Progress':
    'prefix': 'wxprogress'
    'body': '<progress percent={{$1}} show-info={{$2}} stroke-width="{{$3}}" color="{{$4}}" active="{{$5}}">$6</progress>$0'

  'wxml Button':
    'prefix': 'wxbutton'
    'body': '<button size="${1:default}" type="${2:default}" plain="${3:false}" disabled="${4:false}" loading="${5:false}" form-type="$6" hover-class="$7">$8</button>$0'

  'wxml Checkbox Group':
    'prefix': 'wxcheckbox-group'
    'body': """
      <checkbox-group bindchange="$1">
        <checkbox wx:for="{{$2}}" value="{{$3}}" disabled="${4:false}" checked="${5:false}"/>{{$6}}
      </checkbox-group>
    """

  'wxml Checkbox':
    'prefix': 'wxcheckbox'
    'body': '<checkbox value="{{$1}}" disabled="${2:false}" checked="${3:false}"/>$0'

  'wxml Input':
    'prefix': 'wxinput'
    'body': """
        <input value="{{$1}}" type="${2:text}" password=${3:fasle} placeholder="$4" placeholder-style="$5"
      placeholder-class="$6" disabled="${7:false}" maxlength="${8:140}" auto-focus="${9:false}" bindchange="$10"
      bindinput="$11" bindfocus="$12" bindblur="$13"/>$0
    """

  'wxml Label':
    'prefix': 'wxlabel'
    'body': '<label for="$1" class="$2"></label>$0'

  'wxml Picker Selector':
    'prefix': 'wxpicker selector'
    'body': '<picker mode="selector" range="${1:[]}" value="${2:0}" bindchange="$3">\n\t$4\n</picker>$0'

  'wxml Picker Time':
    'prefix': 'wxpicker time'
    'body': '<picker mode="time" value="${1:hh\:mm}" start="${2:hh\:mm}" end="${3:hh\:mm}" bindchange="$4">\n\t$5\n</picker>$0'

  'wxml Picker Date':
    'prefix': 'wxpicker date'
    'body': '<picker mode="date" value="${1:yyyy-MM-mm}" start="${2:yyyy-MM-dd}" end="${3:yyyy-MM-dd}" fields="${4:day}" bindchange="$5">\n\t$6\n</picker>$0'

  'wxml Radio Group':
    'prefix': 'wxradio-group'
    'body': """
      <radio-group class="$1" bindchange="$2">
        <radio wx:for="{{$3}}" value="{{$4}}" checked="${5:false}" disabled="${6:false}"/>{{$7}}
      </radio-group>$0
    """

  'wxml Radio':
    'prefix': 'wxradio'
    'body': '<radio value="{{$1}}" checked="${2:false}" disabled="${3:false}"/>{{$4}}$0'

  'wxml Slider':
    'prefix': 'wxslider'
    'body': '<slider min="${1:0}" max="${2:100}" step="${3:1}" disabled="${4:false}" value="${5:0}" show-value="${5:false}" bindchange="$6"/>$0'

  'wxml Switch':
    'prefix': 'wxswitch'
    'body': '<switch checked="${1:false}" type="${2:switch}" bindchange="$3"/>$0'

  'wxml Form':
    'prefix': 'wxform'
    'body': '<form bindsubmit="$1" bindreset="$2" report-submit="$3">\n\t$4\n</form>$0'

  'wxml Action Sheet Item':
    'prefix': 'wxaction-sheet-item'
    'body': '<action-sheet-item class="$1" bindtap=""$2">$3</action-sheet-item>$0'

  'wxml Action Sheet':
    'prefix': 'wxaction-sheet'
    'body': """
      <action-sheet bindchange="$1">
        <block wx:for="{{$2}}">
          <action-sheet-item bindtap="{{$2}}">{{$3}}</action-sheet-item>
        </block>
        <action-sheet-cancel>{{$4}}</action-sheet-cancel>
      </action-sheet>
    """

  'wxml Modal':
    'prefix': 'wxmodal'
    'body': """
      <modal title="$1" no-cancel="${2:fasle}" confirm-text="${3:确定}" cancel-text="${4:取消}" bindconfirm="$5" bindcancel="$6">
        <view class="$7">$8</view>
      </modal>$0
    """

  'wxml Toast':
    'prefix': 'wxtoast'
    'body': '<toast hidden="{{$1}}" duration="${2:1500}" bindchange="$3">\n\t$4\n</toast>$0'

  'wxml Loading':
    'prefix': 'wxloading'
    'body': '<loading hidden="{{$1}}" bindchange="$2">\n\t$3\n</loading>$0'

  'wxml Navigator':
    'prefix': 'wxnavigator'
    'body': '<navigator url="{{$1}}" redirect="${2:false}" hover-class="${3:navigator-hover}">$4</navigator>$0'

  'wxml Audio':
    'prefix': 'wxaudio'
    'body': """
      <audio action="{{$1}}" src="{{$2}}" loop="${3:false}" controls="${4:true}" poster="$5" name="$6" author="$7"
        binderror="$8" bindplay="$9" bindpause="$10" bindratechange="$11" bindtimeupdate="$12" bindended="$13">$14</audio>$0
    """

  'wxml Image':
    'prefix': 'wximage'
    'body': '<image src="{{$1}}" mode="${2:scaleToFill}" binderror="$3" bindload="$4"></image>$0'

  'wxml Video':
    'prefix': 'wxvideo'
    'body': '<video src="{{$1}}" binderror="$2"></video>$0'

  'wxml Map':
    'prefix': 'wxmap'
    'body': '<map longitude="$1" latitude="$2" scale="${3:16}" markers="$4" covers="$5"></map>$0'

  'wxml Map':
    'prefix': 'wxcanvas'
    'body': '<canvas canvas-id="$1" binderror="$2"></canvas>$0'

  # wxml api
  'wxml GetApp':
    'prefix': 'wxgetApp'
    'body': 'getApp()'

  'wxml setData':
    'prefix': 'wxsetData'
    'body': 'setData({\n$1\n})'

  'wxml Require':
    'prefix': 'wxrequire'
    'body': 'require("$1")$0'

  'wxml Module Exports':
    'prefix': 'wxmodule.exports'
    'body': 'module.exports.$1 = $2'

  'wxml Module Exports':
    'prefix': 'wxexports'
    'body': 'exports.$1 = $2'

  'wxml Import':
    'prefix': 'wximport'
    'body': '<import src="$1"/>$0'

  'wxml Include':
    'prefix': 'wxinclude'
    'body': '<include src="$1"/>$0'

Q: swiper 高度自适应的时候 flex=1 手机上无效
A:
!!向狗日的微信低头
小程序的屏幕宽度固定为 750rpx，市面上的手机屏幕宽高比大概为 3:2 5:3 16:9 三种
得到一般最小的高度为 1125rpx，所以根据这个值来曲线救国🙄️
S: http://www.xyaz.cn/thread-71-1-1.html
U: height: calc(100% - xxxrpx);

Q: 小程序安卓真机预览报错：内部错误
A:
应该就是程序编译的时候出错了，却没有指出具体的错误。只能自己一点点扫描所有代码。。。
花了不少时间，不过如果能掌握套路的话还是能很快找出的。

  1. app.json 里取消注册一些页面，排除法定位到具体出错的页面。
  2. wxml 文件可以利用搜索和正则表达式检查是否存在封闭标签没有封闭或者非封闭标签封闭了的情况。
  3. js 文件可以大段大段的注释，逐步还原的方式找到错误点。 一般都是不支持 ES6 语法导致的。比如 for...of Set Map 等等。

Q: 登录失败。。。
A: wx.request 返回结果在安卓上 statusCode 是字符串