uni-app 导航栏tabbar

注意

tabbar里的界面需要先在pages里注册

代码

​
{
	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
		{
			"path": "pages/index/index",
			"style": {
				"navigationBarTitleText": "上传数据"
			}
		},
		{
			"path": "pages/personalCenter/PersonalCenter",
			"style": {
				"navigationBarTitleText": "个人中心"
			}
		},
		{
			"path": "pages/dataStatistics/DataStatistics",
			"style": {
				"navigationBarTitleText": "数据统计"
			}
		}
	],
	"globalStyle": {
		"navigationBarTextStyle": "black",
		"navigationBarTitleText": "uni-app",
		"navigationBarBackgroundColor": "#F8F8F8",
		"backgroundColor": "#F8F8F8"
	},
	"tabBar": {
		"color": "#7A7E83",
		"selectedColor": "#259FDE", //点击后的颜色
		"borderStyle": "black",
		"backgroundColor": "#ffffff",
		"list": [{
			"pagePath": "pages/index/index",
			"iconPath": "static/upload.png",
			"selectedIconPath": "static/upload_blue.png",
			"text": "数据上传"
		},
		{
			"pagePath": "pages/dataStatistics/DataStatistics",
			"iconPath": "static/chart.png",
			"selectedIconPath": "static/chart_blue.png", //点击后的图标
			"text": "数据统计"
		},
		{
			"pagePath": "pages/personalCenter/PersonalCenter",
			"iconPath": "static/user.png",
			"selectedIconPath": "static/user_blue.png",
			"text": "个人中心"
		}
		]
	}
}

​

效果