uniapp开发App(iOS、Android、鸿蒙Next)之配置pages.json 页面路由(三)

pages.json 文件用来对 uni-app 进行全局配置,决定页面文件的路径、窗口样式、原生的导航栏、底部的原生 tabbar 等。

导航栏高度为 44px (不含状态栏),tabBar 高度为 50px (不含安全区)。

它类似微信小程序中app.json的页面管理部分。注意定位权限申请等原属于app.json的内容,在 uni-app 中是在 manifest 中配置。

配置项列表

官方文档

实际项目情况配置

这里APP分为四个模块,那么就需要配置四个tabbar

bash 复制代码
	"pages": [
		{
			"path": "pages/tabbar/device/device",
			"style": {
				"navigationStyle": "custom",
				"disableSwipeBack": true,  // 禁止滑动返回
				"app-plus": {
					"bounce": "vertical",
					"titleNView": false
				}
			}
		},
		{
			"path": "pages/tabbar/shopMall/shopMall",
			"style": {
				"navigationStyle": "custom",
				"disableSwipeBack": true,  // 禁止滑动返回
				"app-plus": {
					"bounce": "vertical",
					"titleNView": false
				}
			}
		},
		{
			"path": "pages/tabbar/wallect/wallect",
			"style": {
				"navigationStyle": "custom",
				"disableSwipeBack": true,  // 禁止滑动返回
				"app-plus": {
					"bounce": "vertical",
					"titleNView": false
				}
			}
		},
		{
			"path": "pages/tabbar/my/my",
			"style": {
				"navigationStyle": "custom",
				"disableSwipeBack": true,  // 禁止滑动返回
				"app-plus": {
					"bounce": "vertical",
					"titleNView": false
				}
			}
		}
	],
	"subPackages": [
		{
			"root": "pages/device",
			"pages": [
				{
					"path": "",
					"style": {
						
					}
				}
			]
		}
	]
相关推荐
杊页2 小时前
系列二:MVVM 深度实战与项目重构 | 第5篇 ViewModel 核心原理与实战避坑:它是如何“死而复生”的?
android
17715574312 小时前
unity6国际版安装及android SDK ,JDK,NDK安装
android
jingling5552 小时前
Flutter | 商城项目鸿蒙(OpenHarmony)适配实战
android·开发语言·前端·flutter·华为·harmonyos
黄林晴2 小时前
重磅:继SDK、NDK后谷歌新推出ADK!
android·kotlin
坏柠2 小时前
从一个设备控制面板开始,系统学习 LVGL 界面开发
android·javascript·学习
郑州光合科技余经理2 小时前
海外版外卖系统源码:支付/地图/多语言核心代码实现
android·java·前端·后端·架构·uni-app·php
核电机组3 小时前
flutter集成到Android混合开发
android·flutter
游戏开发爱好者83 小时前
Linux 自动上传 App Store Connect:把 IPA 上传流程接进CI工作流
linux·运维·ios·ci/cd·小程序·uni-app·iphone
恋猫de小郭3 小时前
Android 17 内存管理将严格管控,App 要注意适配
android·前端·flutter