Uniapp 页面开发实战教程：导航栏配置、下拉刷新与上拉加载

一、导航栏配置

在pages.json中配置全局/页面级导航栏：

{
  "globalStyle": {
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "首页",
    "navigationBarBackgroundColor": "#007AFF"
  },
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "首页",
        "enablePullDownRefresh": true
      }
    }
  ]
}

核心参数说明：

• navigationBarTitleText：标题文字
• navigationBarBackgroundColor：背景色（十六进制值）
• navigationBarTextStyle：标题颜色（仅支持black/white）
• disableScroll：是否禁止页面滚动（默认为false）

二、下拉刷新实现

步骤1：开启配置

// pages.json
{
  "pages": [
    {
      "path": "pages/list/list",
      "style": {
        "enablePullDownRefresh": true
      }
    }
  ]
}
</