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": {
						
					}
				}
			]
		}
	]
相关推荐
恋猫de小郭17 分钟前
Flutter hit,一个可以灵活控制溢出点击的第三方包
android·前端·flutter
古韵21 分钟前
小程序上传进度条,还要自己监听 onProgressUpdate 吗?
前端·javascript·uni-app
我命由我1234535 分钟前
Kotlin 面向对象 - 枚举排序
android·java·开发语言·java-ee·kotlin·android studio·android-studio
90后的晨仔1 小时前
Xcode 26.6编译 AFNetworking 报错全解:5 种方案从应急到根治
ios
初级代码游戏15 小时前
iOS开发 Swift 速记1:变量和基本数据类型
开发语言·ios·swift
for_ever_love__16 小时前
iOS:网络请求再学习
网络·学习·ios·objective-c
fengci.17 小时前
Microweber CMS 未授权路径穿越漏洞(CVE-2026-65694)
android·开发语言·前端·学习·php
stevenzqzq19 小时前
Android 矢量图(Vector Drawable)核心坐标与尺寸机制技术文档
android
plainGeekDev19 小时前
运行时获取依赖 → 编译时注入
android·java·kotlin
Wiktok19 小时前
Vue3(Vite)打包安卓APP 完整最佳实践
android·vue