在自定义导航的时候,如果不对顶部距离处理的话就会顶到屏幕最上边,标题可能会被手机的齐刘海挡住。

之前在做小程序的时候,我都是用 getMenuButtonBoundingClientRect() 获取胶囊菜单的顶部距离等信息来处理顶部安全距离,但在app和H5上用不了,不过uniapp提供了个更好用的 var(–window-bottom) (在css使用)

padding-top:  var(--status-bar-height) ;//给组件加个上边距

/*或者写一个占位div,高度设为css变量
height: var(--status-bar-height);*/

可以封装个自定义导航组件,这样就不用每个页面都改了。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐