微信小程序自定义头部（navigationStyle）及手机适配

一、官方文档https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html    -----页面配置中

avigationStyle 导航栏样式，仅支持 default/custom。custom  模式可自定义导航栏，只保留右上角胶囊状的按钮)。

在app.json window 增加 navigationStyle:custom ，顶部导航栏就会消失，保留右上角胶囊状的按钮，

 

1.如何兼容适配所有机型，包括刘海屏？

A：使用 wx.getSystemInfoSync()['statusBarHeight'] 则能获取到顶部状态栏的高度，单位为px.