uniapp 导航栏tabBar

注意:
(1)当设置导航栏在顶部,即position为top时,只能配置文字,不能配置图标
(2)当设置导航栏在顶部时,仅微信有效
(3)图标不接受网络图片和字体图标
(4)导航栏选项2-5个

1、在pages.json的"pages"的数组中先注册页面
2、与"globalStyle"同级设置导航栏	
	
	"tabBar":{
	"list":[  设置选项
		{
			"text":"bar名称",
			"pagePath":"页面路径",
			"iconPath":"bar图片路径",
			"selectedIconPath":"选中的图片路径"
		},
			...至少设置2个,最多5个
	],
	"color":"16进制字体颜色",
	"selectedColor":"16进制选中的字体颜色",
	"backgroundColor":"导航栏背景色",
	"position":"bottom",  导航栏位置,bottom/top
	"borderStyle":"white"  导航栏边框色,white/black,App支持其他颜色
	
	}

tabBar文档再滚动条3/4处

代码示例:

{
	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
		
		{
			"path": "pages/message/message",
			"style": {
				"navigationBarTitleText": "study1",
				"backgroundColor":"#4CD964",
				"h5":{
					"pullToRefresh":{
						"color":"#007AFF",
						"offset":"20%"
					}
				}
			}
		},
		
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "uni-app"
			}
		},
		
		{
			"path": "pages/me/me",
			"style": {
				"navigationBarTitleText": "me"
			}
		}
	],
	"globalStyle": {
		"navigationBarTextStyle": "black",
		"navigationBarTitleText": "uni-appaa",
		"navigationBarBackgroundColor": "#008000",
		"backgroundColor": "#008000",
		"enablePullDownRefresh":true,
		"backgroundTextStyle":"light",
		"onReachBottomDistance":100
	},
	"tabBar":{
		"list":[
			{
				"text":"首页",
				"pagePath":"pages/index/index",
				"iconPath":"static/tabs/home.png",
				"selectedIconPath":"static/tabs/home-active.png"
			},
			{
				"text":"信息",
				"pagePath":"pages/message/message",
				"iconPath":"static/tabs/message.png",
				"selectedIconPath":"static/tabs/message-active.png"
			
			},
			{
				"text":"我的",
				"pagePath":"pages/me/me",
				"iconPath":"static/tabs/contact.png",
				"selectedIconPath":"static/tabs/contact-active.png"
			
			}
		],
		"color":"#9CDCFE",
		"selectedColor":"#008000",
		"backgroundColor":"#272822",
		"position":"top",
		"borderStyle":"white"
		
	}
}