uniapp 实现底部导航栏tabbar

pages.json文件下配置tabBar

{
    
      "pages":[
            ...
      ],
      "tabBar": {
    
			"color":"#8a8a8a",
			"selectedColor":"#00aa00",
			"borderStyle":"black",
			"backgroundColor":"#ffffff",
			"list": [
				{
    
					"pagePath":"pages/index/index",
					"text":"首页",
					"iconPath":"static/home_normal.png",
					"selectedIconPath":"static/home.png"
				},
				{
    
					"pagePath":"pages/search/search",
					"text":"发现",
					"iconPath":"static/search_normal.png",
					"selectedIconPath":"static/search.png"
				},
				{
    
					"pagePath":"pages/me/me",
					"text":"我的",
					"iconPath":"static/me_normal.png",
					"selectedIconPath":"static/me.png"
				}
			]	
		 },
      "globalStyle": {
    
		...
	}
}

tabBar参数说明

pagePath：页面路径
text：底部导航文字
iconPath：没选中前的图标路径
selectedIconPath：选中后的图标路径

参考地址