小程序开发过程中踩过的坑

1.自定义头部导航栏
目前微信小程序不支持单个页面设置，一旦在要决定使用自定义导航栏，那么每个页面都需要设置，建议写成组件，避免代码重复。具体代码就不上了，还是要自己思考嘛~

2.调起相机
由于camera是原生组件，层级最高（z-index无效），需要cover-view，cover-image添加图片；device-position = 'front'或back来切换前后置摄像头。

<camera style='height: 580rpx;width:580rpx;margin-top: 100rpx;margin-left: 82rpx;' device-position="{{camera?'back':'front'}}" flash="off" binderror='error'>
    <cover-view class=''>
        <cover-image src='../../images/circle.png' class=''></cover-image>
    </cover-view>
</camera>

比如上面的这个圈圈.jpg

// 拍照方法  
const ctx = wx.createCameraContext() 
ctx.takePhoto ({
  quality: 'high', // 照片质量
  success: (res) => { // 回调
    this.setData({
      // 临时照片路径
      src: res.tempImagePath
    })
  }
})

3.关于wx.navigateBack和wx.navigateTo
使用wx.navigateTo需注意层级问题，一直入栈而不出栈会导致无法继续跳转（小程序中页面栈最多十层）。navigateBack有参数delta，如果 delta 大于现有页面数，则返回到首页。

wx.navigateBack({
    delta: 1,
})

navigateTo 只能打开非 tabBar 页面。

4.关于小程序适配iPhone X及以上（XR，Xs，Xs Max）
wx.getSystemInfo()已经可以正确获取到XR，Xs，Xs Max的型号信息了（res.model）由于这些机型底部有34pt是留给Home Indcator，不能识别点击事件等操作，所以要把底部的button或者navbar向上提高34pt。

还有很多没有写到的，回头总结总结再发出来吧~
第一次写东西有点儿紧脏，以后还会陆续更新一些关于前端的东西的~