pages.json文件是用来对uni-app 进行全局配置,其中包括页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。其中常用的几个属性:
1. pages: pages 节点配置应用由哪些页面组成,pages 节点接收一个数组,数组每个项都是一个对象。style用于设置每个页面的状态栏、导航条、标题、窗口背景色,页面中配置项会覆盖globalStyle中相同的配置项。
pages节点中的第一项是应用的入口文件。
每次新增或者减少页面,都需要对pages数组进行修改。
文件名不需要写后缀,框架会自动寻找对应路径下的页面资源。
2. globalStyle: 用于设置应用的状态栏、导航条、标题、窗口背景色等。
3. 设置自定义导航栏
navigationStyle为custom,当navigationStyle设为custom设为false时,原生导航栏不显示。非H5端,手机顶部状态栏区域会被页面内容覆盖。这是因为窗体是沉浸式的原因,即全屏可写内容。uni-app提供了状态栏高度的css变量--status-bar-height,如果需要把状态栏的位置从前景部分让出来,可写一个占位div,高度设为css变量。
4. easyCom超级组件
传统vue组件,需要安装、引用、注册,三个步骤后才能使用组件。easycom将其精简为一步。
manifest.json 配置用来配置app、小程序、h5的信息,比如配置代理,h5模板,小程序appId,app的名称、图标等。h5配置代理解决跨域问题。
1. pages: pages 节点配置应用由哪些页面组成,pages 节点接收一个数组,数组每个项都是一个对象。style用于设置每个页面的状态栏、导航条、标题、窗口背景色,页面中配置项会覆盖globalStyle中相同的配置项。
pages节点中的第一项是应用的入口文件。
每次新增或者减少页面,都需要对pages数组进行修改。
文件名不需要写后缀,框架会自动寻找对应路径下的页面资源。
2. globalStyle: 用于设置应用的状态栏、导航条、标题、窗口背景色等。
3. 设置自定义导航栏
navigationStyle为custom,当navigationStyle设为custom设为false时,原生导航栏不显示。非H5端,手机顶部状态栏区域会被页面内容覆盖。这是因为窗体是沉浸式的原因,即全屏可写内容。uni-app提供了状态栏高度的css变量--status-bar-height,如果需要把状态栏的位置从前景部分让出来,可写一个占位div,高度设为css变量。
4. easyCom超级组件
传统vue组件,需要安装、引用、注册,三个步骤后才能使用组件。easycom将其精简为一步。
manifest.json 配置用来配置app、小程序、h5的信息,比如配置代理,h5模板,小程序appId,app的名称、图标等。h5配置代理解决跨域问题。