uni-app 中隐藏 H5 页面头部导航栏 page-head 的两种方式

H5端去除小程序的顶部解决方案思路:

  1. 使用 uni-app /* #ifdef H5 */ 判断是否为 H5

  2. 定位生成的顶部导航栏元素(page-head)。

  3. App.vue 设置 H5 时生效 display: none

小程序显示顶部,h5页面隐藏顶部

pages.json中

1{ ...... "globalStyle": { ...... "navigationStyle": "default" ...... } ...... }

App.vue中设置全局样式

使用uni-app /* #ifdef H5 */判断是否为h5

1/* #ifdef H5 */ uni-page-head { display: none; } /* #endif */

仅H5隐藏示例

全部隐藏

pages.json中

1{ …… “globalStyle”: { …… “navigationStyle”: “custom” …… } …… }

全端隐藏示例