uni-app 之 tabBar 底部切换按钮

uni-app 之 tabBar 底部切换按钮

1693289945724.png

复制代码
{
    "pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
        {
            "path": "pages/home/home",
            "style": {
                "navigationBarTitleText": "首页1",
                "enablePullDownRefresh": false
            }
        }, {
            "path": "pages/list/list",
            "style": {
                "navigationBarTitleText": "",
                "enablePullDownRefresh": false
            }
        }
    ],
    "globalStyle": {
        // globalStyle全局设置、pages里面是单独的页面设置,如果页面没有设置就统一走全局设置
        "navigationBarTextStyle": "black",
        "navigationBarTitleText": "uni-app",
        "navigationBarBackgroundColor": "#F8F8F8",
        "backgroundColor": "#F8F8F8"
    },
    "uniIdRouter": {},
    // 底部切换按钮,核心代码其实就是下面的 "tabBar": { } 这一块,注意图片等资源一定要放在static文件夹下,否则会异常不展示
    "tabBar": {
        "selectedColor": "#1296db",
        "color": "#2c2c2c",
        "list": [{
                "text": "首頁",
                "pagePath": "pages/home/home",
                "selectedIconPath": "static/img/tabbar_home1.png",
                "iconPath": "static/img/tabbar_home2.png"
            },
            {
                "text": "列表",
                "pagePath": "pages/list/list",
                "selectedIconPath": "static/img/tabbar_ml1.png",
                "iconPath": "static/img/tabbar_ml2.png"
            }
        ]
    }
}

// 常用颜色

// d81e06 紅

// #f4ea2a 黃

// #1afa29 綠

// #1296db 藍

// #13227a 青

// #d4237a 紫

// #ffffff 白

// #2c2c2c 黑

相关推荐
杀气丶几秒前
Linux下运行芙蕾雅天堂2【俄文简译L2FATER】
运维·服务器·天堂2·l2fater·l2fater.cn
喵手2 分钟前
玩转Java网络编程:基于Socket的服务器和客户端开发!
java·服务器·网络
太空的旅行者1 小时前
告别双系统——WSL2+UBUNTU在WIN上畅游LINUX
linux·运维·ubuntu
人工智能训练师3 小时前
Ubuntu22.04如何安装新版本的Node.js和npm
linux·运维·前端·人工智能·ubuntu·npm·node.js
灿烂阳光g3 小时前
domain_auto_trans,source_domain,untrusted_app
android·linux
研华嵌入式4 小时前
如何在高通跃龙QCS6490 Arm架构上使用Windows 11 IoT企业版?
arm开发·windows·嵌入式硬件
Tisfy4 小时前
服务器 - 从一台服务器切换至另一台服务器(损失数十条访客记录)
运维·服务器
Ronin3055 小时前
【Linux系统】日志与策略模式
linux·策略模式·日志
猎板PCB黄浩5 小时前
从废料到碳减排:猎板 PCB 埋容埋阻的绿色制造革命,如何实现环保与性能双赢
java·服务器·制造
ZzzK,5 小时前
JAVA虚拟机(JVM)
java·linux·jvm