uni-app学习笔记十九--pages.json全局样式globalStyle设置

pages.json 页面路由

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

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

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

page.json配置项列表

本篇先来学习 globalStyle

globalStyle用于设置应用的状态栏、导航条、标题、窗口背景色等。下面介绍下它几个常用的属性配置**(PS:不同的小程序，配置属性会略有差异，详情请查看官方文档)**：

1.navigationBarTextStyle：导航栏标题颜色及状态栏前景颜色，仅支持 black/white，默认为black;

2.navigationBarTitleText:导航栏标题文字内容;

3.navigationBarBackgroundColor:导航栏背景颜色（同状态栏背景色）;

4.backgroundColor:下拉显示出来的窗口的背景色;

5.backgroundTextStyle:下拉 loading 的样式，仅支持 dark / light；

6.enablePullDownRefresh：是否开启下拉刷新；

7.onReachBottomDistance：页面上拉触底事件触发时距页面底部距离，单位只支持px。

页面上拉触底事件的使用：

javascript 复制代码

<script setup>
 import {onReachBottom} from "@dcloudio/uni-app"
 onReachBottom(()=>{
	 console.log("触底加载...")
 })
</script>