uniapp,pages.json文件中tabBar

uniapp,pages.json文件中tabBar

在 pages.json 中提供 tabBar 配置,和pages,globalStyle同级
tabBar 中的 list 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序
当设置 position 为 top 时,将不会显示 icon

"tabBar": {
		"color": "#999999",//tab 上的文字默认颜色
		"selectedColor": "#9846FF",//tab 上的文字选中时的颜色
		"borderStyle": "white",//tabbar 上边框的颜色,可选值 black/white
		"backgroundColor": "#ffffff",//tab 的背景色
		"list": [{
				"pagePath": "pages/index/index",//页面路径,必须在 pages 中先定义
				"text": "首页",//tab 上按钮文字,在 App 和 H5 平台为非必填。例如中间可放一个没有文字的+号图标
				"iconPath": "./static/img/icon/home_normal.png",//图片路径
				"selectedIconPath": "./static/img/icon/home.png",//选中时的图片路径
				"width": "10px",
				"height": "20px"
			},
			{
				"pagePath": "pages/message/index",
				"text": "消息",
				"iconPath": "./static/img/icon/message_normal.png",
				"selectedIconPath": "./static/img/icon/message.png"
			},
			{
				"pagePath": "pages/goods/index",
				"aliasPath": "/goods",
				"text": "抢他",
				"iconPath": "./static/img/icon/snapUp_normal.png",
				"selectedIconPath": "./static/img/icon/snapUp.png"
			},
			{
				"pagePath": "pages/my/index",
				"text": "我的",
				"iconPath": "./static/img/icon/my_normal.png",
				"selectedIconPath": "./static/img/icon/my.png"
			}
		]
	},

官方文档
https://uniapp.dcloud.io/collocation/pages.html#tabbar

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值