Skip to content

router

路由管理器提供了完整的页面跳转和导航功能,支持多种跳转模式、参数传递、页面状态检查等功能。

API 参考

方法名参数返回值说明
paramsUTSJSONObject获取上个页面传递的路由参数
defaultPathname: stringstring根据页面名称获取默认路径
getPagesPageInstance[]获取当前页面栈中的所有页面实例
getPagepath: stringPageInstance根据路径获取指定的页面实例
routePageInstance获取当前活跃的路由页面实例
pathstring获取当前页面的完整路径
topath: string快速页面跳转(默认使用 navigateTo 模式)
pushoptions: PushOptions功能完整的路由跳转,支持多种模式和参数
home跳转回应用首页
backoptions: BackOptions | null返回上一页,若已在首页则跳转到首页
callMethodname: string, data?: anyany | null调用当前页面组件暴露的方法
isFirstPageboolean检查当前页面栈是否只有一个页面
isHomePageboolean检查当前页面是否为应用首页
isCustomNavbarPageboolean检查当前页面是否使用了自定义导航栏
isCurrentPageboolean检查指定路径是否为当前页面
isTabPageboolean检查当前页面是否为底部标签页
isLoginPageboolean检查当前页面是否为登录页面
login跳转到登录页面
nextLogin处理登录成功后的页面跳转逻辑
beforeEachcallback注册页面跳转前的全局守卫钩子
afterLogincallback注册用户登录成功后的回调处理

类型定义

ts
type BackOptions = {
	delta?: number;
	animationType?: BackAnimationType;
	animationDuration?: number;
	success?: (result: any) => void;
	fail?: (result: any) => void;
	complete?: (result: any) => void;
};

type PushMode = "navigateTo" | "redirectTo" | "reLaunch" | "switchTab";

type PushOptions = {
	path: string;
	mode?: PushMode;
	events?: any;
	query?: any;
	params?: any;
	animationType?: PushAnimationType;
	animationDuration?: number;
	success?: (result: any) => void;
	fail?: (result: any) => void;
	complete?: (result: any) => void;
};

基础用法

简单页面跳转

typescript
import { router } from "@/.cool";

// 最简单的页面跳转
router.to("/pages/user/profile");

// 等同于 uni.navigateTo
router.push({
	path: "/pages/user/profile"
});

传递参数

typescript
router.push({
	path: "/pages/user/profile",
	query: {
		id: 123,
		name: "张三"
	}
});

// 在目标页面接收参数
const query = router.query();
console.log(query.id); // 123
console.log(query.name); // '张三'

不同跳转模式

typescript
// 保留当前页面,跳转到新页面(默认)
router.push({
	path: "/pages/detail",
	mode: "navigateTo"
});

// 关闭当前页面,跳转到新页面
router.push({
	path: "/pages/detail",
	mode: "redirectTo"
});

// 关闭所有页面,跳转到新页面
router.push({
	path: "/pages/home",
	mode: "reLaunch"
});

// 跳转到 tab 页面
router.push({
	path: "/pages/tabbar/home",
	mode: "switchTab"
});

页面状态检查

typescript
// 检查当前页面状态
if (router.isFirstPage()) {
	console.log("这是页面栈中的第一个页面");
}

if (router.isHomePage()) {
	console.log("当前在首页");
}

if (router.isTabPage()) {
	console.log("当前在标签页");
}

if (router.isLoginPage()) {
	console.log("当前在登录页");
}

页面栈操作

typescript
// 获取当前页面信息
const current = router.route();
console.log("当前页面信息:", current);

// 获取所有页面实例
const pages = router.getPages();
console.log("页面栈深度:", pages.length);

页面返回

typescript
// 简单返回上一页
router.back();

// 返回多个页面
router.back({
	delta: 2 // 返回上2个页面
});

// 如果是首页,返回时会跳转到首页
// 如果不是首页,正常返回上一页

路由守卫

typescript
// 注册全局路由守卫
router.beforeEach((to, next) => {
	console.log("准备跳转到:", to.url);

	// 检查登录状态
	if (user.isNull()) {
		// 跳转到登录页
		router.login();
		return;
	}

	// 继续跳转
	next();
});

// 注册登录后回调
router.afterLogin(() => {
	console.log("用户登录成功");
});