更新记录

1.0.4（2024-05-12）

• 小更新

1.0.3（2024-05-11）

• 更新示例项目 - 删除多余注释

1.0.2（2024-05-11）

• 更新示例项目 - 是否需要等于的判断用 pages.json 中自带的 needLogin 配置进行判断，不再另外配置 meta 字段了

平台兼容性

hi-uniapp-router

• 路由跳转、路由拦截、路由守卫
• 可以进行简单的路由跳转拦截
• 只支持 vue3+ 版本

地址

• Gitee仓库地址
• uni-app插件市场地址

配置

• 在 main.js 中引入，并进行初始化配置

// 引入hi-router
import "@/uni_modules/hi-router";

// 初始化配置hirouter
uni.$hiRouter.setConfig({
    // 是否开启调试，开启调试后每次使用hi-router进行页面跳转时会在控制台打印目标路由信息和当前路由信息
    debug: true,

    // 路由跳转之前的拦截函数
    // 该函数返回 false 则路由终止跳转，否则路由正常跳转
    before: (target, current) => {
        // 一个拦截示例：
        // 判断目标页面是否需要登录后才能浏览
        if (target?.needLogin && !uni.getStorageSync("USERINFO")) {
            uni.showModal({
                title: "提示",
                content: "目标页面需要登录，请先登录！",
                success: (res => {
                    if (res.confirm) {
                        uni.$hiRouter.navigateTo({
                            url: "/pages/auth/login"
                        });
                    }
                })
            });
            return false;
        }
        return true
    }
});

使用

• 通过上面的步骤配置好后，hi-router 就会在 uni 上自动挂载 $hiRouter，然后就可以通过下面的方式进行使用了
• 跳转函数参数和 uni.xxx 对应的路由跳转方法一致

// 保留当前页面，跳转到应用内的某个页面
uni.$hiRouter.navigateTo(OBJECT);

// 关闭当前页面，跳转到应用内的某个页面
uni.$hiRouter.redirectTo(OBJECT);

// 关闭所有页面，打开到应用内的某个页面
uni.$hiRouter.reLaunch(OBJECT);

// 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
uni.$hiRouter.switchTab(OBJECT);

// 关闭当前页面，返回上一页面或多级页面
uni.$hiRouter.navigateBack(OBJECT);