在开发 项目过程中，有许多配置项需要我们自己去操作配置，我们最常操作的就是项目的全局配置和配置，项目的栏、 Tab 栏、窗口背景色等。

主要通过操作项目根目录下面的 pages.json ，来进行项目的全局配置和配置。

接下来我们来学习怎样进行项目的配置。

下面的这些都是用来进行项目配置的。一些常用的配置项，项目创建完成后，会帮我们，我们需要去了解每个配置项的含义，以及配置项对应的设置条件有哪些限制。

比如导航栏颜色样式 navigationBarTextStyle 这配置项，仅black/white 这两个颜色的设置，很多人会设置成十六进制颜色，比如 #0000FF，这样系统就会识别不了。

接下来我们通过实例来了解一下各个配置项的应用。

全局配置作用于整个项目，也就是对项目中所有的都起作用，在项目根目录下面的 pages.json 中，找到globalStyle配置项，个配置项中进行项目的全局配置。

实例：

"globalStyle": {
  "navigationBarTextStyle": "black", //导航栏颜色
  "navigationBarTitleText": "网", //导航栏
  "navigationBarBackgroundColor": "#F8F8F8", //导航栏背景颜色
  "backgroundColor": "#F8F8F8", //下拉窗口背景颜色
  "backgroundTextStyle":light, //下拉 loading 的样式
  "enablePullDownRefresh":true, //开启下拉刷新
  "onReachBottomDistance":,//上拉触发距距离为60
  "usingComponents":{
    "collapse-tree-item":"/components/collapse-tree-item"
  },//引用组件
  "pageOrientation": "auto"//屏幕旋转
},

想要实现下拉刷新的，需要先在中将 enablePullDownRefresh 设置为 true，再在.vue中配合 onPullDownRefresh 进行下拉的实现。

这里很多人会忘记在中设置 enablePullDownRefresh 配置项，导致下拉失灵。
实例：

//pages.json 
"globalStyle": {
"enablePullDownRefresh":true
}

//.vue
onPullDownRefresh() {
  console.log('refresh');
  //用stopPullDownRefresh结束下拉
  uni.stopPullDownRefresh();
}

这个可以设置为 auto、portrait、landscape。分别代表启用屏幕旋转、固定为竖屏、固定为横屏。认值为 portrait 固定为竖屏。

这个，通常可以使用 js 作为辅助，用 js 读取的区域尺寸，来进行屏幕方向的监听，每次屏幕旋转时都会这个。需要注意的是，在模拟器上面不会触发这个，需要使用真机调试才能触发。
实例：

Page({
  onResize(res) {
    res.size.windowWidth // 新的区域宽度
    res.size.windowHeight // 新的区域高度
  }
})

配置只作用于单个，与全局配置冲突的地方，配置会覆盖掉全局配置。在项目根目录下面的 pages.json 中，找到 pages 配置项里面的 style 来进行配置。

实例：

{
  "pages": [{
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "", //设置
        "disableScroll": true, //设置为true则整体不能上下滚动
        "enablePullDownRefresh":true, //开启下拉刷新
        "navigationBarShadow": {  
          "colorType": "green"
        },//导航栏阴影
      }
    },
    ...
  ]
}

导航栏阴影设置项不是所有的颜色都，需要注意哦。

项目的配置主要就是这些，比较简单，但是很多细节需要我们去注意和掌握。如果掌握不熟练，会在实际开发的过程中埋下很多坑。
本小节主要介绍了 项目的全局配置和配置，重点如下：