首页>内容

uniapp tabBar和启动模式配置

小坏蛋 / / 评论 / 阅读 / 赞
作者有点忙，还没写简介

文章描述：

uniapp的tabBar设置和启动模式配置

tabBar

在pages.json配置tabBar

	"tabBar": {
	    "color": "#7A7E83",
	    "selectedColor": "#3cc51f",
	    "borderStyle": "black",
	    "backgroundColor": "#ffffff",
	    "list": [{
	        "pagePath": "pages/index/index",
	        "iconPath": "static/image/tabbar/home.png",
	        "selectedIconPath": "static/image/tabbar/home-HL.png",
	        "text": "首页"
	    }, {
	        "pagePath": "pages/index/message",
	        "iconPath": "static/image/tabbar/message.png",
	        "selectedIconPath": "static/image/tabbar/message-HL.png",
	        "text": "消息"
	    }, {
	        "pagePath": "pages/user/cache",
	        "iconPath": "static/image/tabbar/user.png",
	        "selectedIconPath": "static/image/tabbar/user-HL.png",
	        "text": "我的"
	    }]
	}

 

uniapp-tabbar

注意：图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px，当 position 为 top 时，此参数无效，不支持网络图片，不支持字体图标。

home.png

home-HL.png

message.png

message-HL.png

user.png

user-HL.png

 

 

tabBar图标上数字

uni.setTabBarBadge({
    index: 1,
    text: '2'
})

 

启动模式

"condition": {
	    "current": 0,
	    "list": [{
	            "name": "首页",
	            "path": "pages/index/index",
	            "query": "interval=4000&autoplay=false"
	        },
	        {
	            "name": "我的",
	            "path": "pages/user/index"
	        }
	    ]
	}

uniapp-启动模式

发布时间：2021/09/24

相关阅读

发表评论

登录

最近发表