uni-app页面路由与底部tarbar选中更换颜色

pages.json 页面路由

uni-app新建项目之后里面都会有一个page.json文件。

pages.json：文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar 等。

{
	"pages": [{
		"path": "pages/component/index",
		"style": {
			"navigationBarTitleText": "组件"
		}
	}, {
		"path": "pages/API/index",
		"style": {
			"navigationBarTitleText": "接口"
		}
	}, {
		"path": "pages/component/view/index",
		"style": {
			"navigationBarTitleText": "view"
		}
	}],
.....
}

在pages.json中配置页面的文件路径（路由导航)如上图这样配置，每当我们新建页面的时候，一般都会有提示是否在page.json中注册。

配置好文件路径之后，在页面当中我们可以直接通过路由跳转API跳转到当前路径页面

路由跳转教程的的API文档页：uni.navigateTo(OBJECT) | uni-app官网 (dcloud.net.cn)

比如：

uni.navigateTo:保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。

uni.navigateTo({
				url: '/pages/myHelp/myHelp'
			})

直接跳转到url中的页面（必须先在page.json中注册才能正常跳转）

底部tarbar选中更换颜色

同样的也是在pages.json文件中,有一个tarbar属性：设置底部 tab 的表现

tarbar属性里面的list就是设置底部tarbar的样式：

pagePath：文件路径，iconPath：icon文件路径，selectedIconPath：选中时候的icon文件路径

如截图所展示，效果图就是

图标库用的是阿里巴巴图标库，官网这边请：iconfont-阿里巴巴矢量图标库