怎么隐藏小程序顶部导航栏(navigationBar)?
官网说:Navigation
是小程序的顶部导航组件,当页面配置 navigationStyle
设置为 custom
的时候可以使用此组件替代原生导航栏。
那么,我们就知道这种效果是可以实现的,其实代码实现也超级简单,下面请看代码配置:
代码实现
一、全局顶部导航栏隐藏
在 app.json
里面的 window
增加 navigationStyle:custom
即可,部导航栏就会消失,只保留右上角胶囊状的按钮。
我们实现了顶部导航栏隐藏,就可以根据我们自己的需求进行顶部导航栏的定制业务,使我们的小程序看上去更加美观。
二、部分页面顶部导航栏隐藏
通过配置部分页面的 json
文件,来覆盖全局 app.json
中的导航栏配置。
app.json:
"window": {
// ... 其他配置省略
"navigationStyle":"default"
}
page.json:
{
"navigationStyle":"custom",
}
如果想要某一个页面实现导航栏隐藏,只需要在这个页面设置 "navigationStyle":"custom"
就可以了。