pages.json 配置

一、配置项 

1.1、 globalStyle 和 pages 

https://uniapp.dcloud.net.cn/collocation/pages.html#pages

"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
    "path": "pages/index/index",
    "style": {
    "navigationBarTitleText": "首页"
}
},
{
    "path" : "pages/news/news",
    "style" : 
    {
    "navigationBarTitleText" : "新闻"
    }
}
],
"tabBar": {
    "color": "#7A7E83",
    "selectedColor": "#3cc51f",
    "list": [{
    "pagePath":"pages/index/index",
    "text":"首页"
},{
    "pagePath":"pages/news/news",
    "text":"新闻"
}]
},
    "globalStyle": {
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "uni-app",
    "navigationBarBackgroundColor": "#F8F8F8",
    "backgroundColor": "#F8F8F8"
},

1.2、自定义导航栏使用注意事项

将原生导航栏隐藏

注意：如果没有原生导航栏，在非h5端，手机顶部状态栏区域会被页面内容覆盖

解决办法：--status-bar-height

<template>
    <view>
        <view class="status_bar"></view>
        <button type="default" @click="doLogin()">微信登录</button>
    </view>
</template>
<style>
    .status_bar{
        height:var(--status-bar-height);
        width:100%;
    }
</style>

1.3、easycom组件使用

1.4、tabBar

1.5、subPackages分包加载