uniapp之导航栏设置和沉浸式的解决方法

最新推荐文章于 2025-03-29 22:23:31 发布

稚嫩的二朵

最新推荐文章于 2025-03-29 22:23:31 发布

阅读量6.3k

点赞数 2

文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/qq_43537814/article/details/114274603

版权

本文介绍了在uniapp中如何设置系统原生导航栏并禁用原生导航栏，以及详细讲解了解决沉浸式问题的方法，通过配置navigationStyle为custom或titleNView为false来实现导航栏的自定义。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

加粗样式使用uniapp无论是开发App还是微信小程序，都避免不了设置导航栏；自定义导航栏会产生一个沉浸式，下面就是设置导航栏和解决沉浸式的方法

设置系统原生导航栏：

	//在pages.json中
	"app-plus": {
   
					"scrollIndicator": "none", //隐藏滚动条
					"titleNView": {
   
						// 搜索框配置
						"searchInput": {
   
							"align": "center",
							"backgroundColor": "#F7F7F7",
							"borderRadius": "4px",
							"placeholder": "搜索糗事",
							"placeholderColor": "#CCCCCC",
							"disabled": true
						},
						//配置按钮
						"buttons"