uniapp项目-配置pages.json-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp项目-配置pages.json。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.配置tabBar

说明：selectedcolor是选中的颜色；lists底部导航栏的每个导航项的列表，

"pagePath"：导航项关联的页面路径。
"text"：导航项显示的文本内容。
"iconPath"：导航项默认状态下的图标路径。
"selectedIconPath"：导航项选中状态下的图标路径。

    "tabBar" : {
        "selectedColor" : "#C00000",
        "list" : [
            {
                "pagePath" : "pages/home/home",
                "text" : "首页",
                "iconPath" : "static/tab_icons/home.png",
                "selectedIconPath" : "static/tab_icons/home-active.png"
            },
            {
                "pagePath" : "pages/cate/cate",
                "text" : "分类",
                "iconPath" : "static/tab_icons/cate.png",
                "selectedIconPath" : "static/tab_icons/cate-active.png"
            },
            {
                "pagePath" : "pages/cart/cart",
                "text" : "购物车",
                "iconPath" : "static/tab_icons/cart.png",
                "selectedIconPath" : "static/tab_icons/cart-active.png"
            },
            {
                "pagePath" : "pages/my/my",
                "text" : "我的",
                "iconPath" : "static/tab_icons/my.png",
                "selectedIconPath" : "static/tab_icons/my-active.png"
            }
        ]
    },

2.配置分包

说明：

"subPackages"：子包的配置列表。
"root"：子包的根目录，表示该子包的页面都位于此目录下。
"pages"：子包中的页面列表。

    "subPackages" : [
        {
            "root" : "subpkg",
            "pages" : [
                {
                    "path" : "goods-detail/goods-detail",
                    "style" : {
                        "navigationBarTitleText" : "",
                        "enablePullDownRefresh" : false
                    }
                },
                {
                    "path" : "goods_list/goods_list",
                    "style" : {
                        "navigationBarTitleText" : "",
                        "enablePullDownRefresh" : true,
                        "onReachBottomDistance": 150,
                        "backgroundColor": "#F8F8F8"
                    }
                },
                {
                    "path" : "search/search",
                    "style" : {
                        "navigationBarTitleText" : "",
                        "enablePullDownRefresh" : false
                    }
                }
            ]
        }
    ],

3.配置全局样式

说明：

"navigationBarTextStyle"：导航栏标题的文字颜色。
"navigationBarTitleText"：导航栏标题的文字内容。
"navigationBarBackgroundColor"：导航栏的背景色。
"backgroundColor"：页面的默认背景色。

    "globalStyle" : {
        "navigationBarTextStyle" : "white",
        "navigationBarTitleText" : "FOREVER",
        "navigationBarBackgroundColor" : "#C00000",
        "backgroundColor" : "#F8F8F8",
        "app-plus" : {
            "background" : "#efeff4"
        }
    },

4.配置page

说明：

"pages"：页面的配置列表。
"path"：页面的路径，用于指定页面所对应的文件位置。
"style"：页面的样式配置，用于定义每个页面的特定样式。

    "pages" : [
      {
          "path" : "pages/home/home",
          "style" : {
              "navigationBarTitleText" : "",
              "enablePullDownRefresh" : false
          }
      },
        {
            "path" : "pages/cate/cate",
            "style" : {
                "navigationBarTitleText" : "",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/cart/cart",
            "style" : {
                "navigationBarTitleText" : "",
                "enablePullDownRefresh" : false
            }
        },
        {
            "path" : "pages/my/my",
            "style" : {
                "navigationBarTitleText" : "",
                "enablePullDownRefresh" : false
            }
        }
    ],

文章来源地址https://www.toymoban.com/news/detail-661744.html

到了这里，关于uniapp项目-配置pages.json的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！