微信小程序：漫漫踩坑路[待续]

这里只对小程序开发中遇到的问题做了个记录，如有错误之处，请给与指正，也不想误导了别人。

1.请求php后台接口，返回json数据多出双引号以及隐藏字符

网上说是php bom头问题，写成了UTF-8+BOM，改为UTF-8就可以了。或者返回的json数据使用JSON.parse(res.data.trim())处理下。
参考博文：微信小程序，请求php后台返回json数据多出隐藏字符问题

2.button 的border 无法覆盖

本以为使用 border:none;就可以将button的border隐藏了，但是发现还是存在，尤其在IOS系统更明显。原来button默认的border是放在 ::after中的，默认为 border:1px solid rgba(0, 0, 0, 0.2)。应修改 ::after内的值。

// app.wxss
button::after{
   border: 0; 
}

参考博文：关于小程序button控件上下边框的显示和隐藏问题

3.分享给好友，记录分享记录

// 分享给好友
onShareAppMessage: function () {
    return {
      title: this.data.win ? '怪我太优秀！' : '憾负！',
      path: `pages/index/index?share_id=${this.data.id}`,
      success: function (res) {
        // 转发成功
        console.log(res)
      },
      fail: function (res) {
        // 转发失败
        console.log(res)
      }
    }
  }

// 好友点击分享的链接进入小程序可以拿到分享人的id
// app.js
onLoad(options){
  options.query.share_id
}

4.打开外链

小程序提供了组件,
定义一个Page页，里面放一个，从上一页拿到地址link，默认铺满屏幕，就ok了

5.图片按钮自定义点击态

用空的包起来，自定义点击态背景添加hover-class属性即可，虽然控制台会警告VM5865:2 should have url attribute when using navigateTo, redirectTo or switchTab，但是不影响效果，忽略就好。

6.音频播放

一开始是用的标签，出现有很多bug。原来没看清文档：1.6.0 版本开始，该组件不再维护。建议使用能力更强的wx.createInnerAudioContext接口。

Page({
  onReady: function () {
    // 创建audio
    this.audioCtx = wx.createInnerAudioContext()
    this.audioCtx.autoplay = true
    this.audioCtx.src =""
  },
  // 播放音效
  playAudio(name) {
    this.audioCtx.src = baseUrl + name + '.mp3';
    this.audioCtx.play()
  }
})

7.上线

腾讯对小程序有很多开发运营规范，比如服务类目。提交审核时，因为有视频播放功能，但是没有这个类目。提交审核后，发回消息：贵方小程序涉及在线观看视频，请补充选择文娱-视频类目，并在基础信息处申请该类目，通过资质审核并在配置功能页添加符合该类目的功能页面。
浪费了不必要的时间，影响了产品的按时上线。所以要细读 微信小程序平台运营规范