uni.addInterceptor，拦截跳转？？

张开发
• 2026/4/16 10:05:52 • 15 分钟阅读

最新文章

推荐文章

相关文章

分享文章

uni.addInterceptor，拦截跳转？？
1. 为什么不用 Axios非要用uni.request你习惯用 Axios 是因为 Web 端它太香了但在 uni-app 里情况变了底层环境不同Axios 是基于浏览器XMLHttpRequest(XHR) 的。而小程序环境压根没有 XHR也没有 DOM。跨端兼容性uni.request是 DCloud 封装的原生 API它在 App、小程序、H5 上都能跑。Axios 能用吗能用但你需要引入专门适配小程序的适配器Adapter。页面权限怎么整核心干货在后台管理系统你会用router.beforeEach做全局拦截。在 uni-app 里方案有三种级别从低到高方案 A手动拦截最笨的办法在每个页面的onLoad或onShow里判断有没有 Token没 Token 就跳登录。缺点累死人代码重复。方案 B拦截跳转 API拦截器机制这是最常用的办法。通过uni.addInterceptor拦截所有的跳转动作。JavaScript// 在 main.js 或 permission.js 中 uni.addInterceptor(navigateTo, { invoke(args) { const token uni.getStorageSync(token) if (!token args.url ! /pages/login/index) { uni.reLaunch({ url: /pages/login/index }) return false // 阻止跳转 } } })方案 C路由插件你现在用的 thinglinks 方案因为你用了uni-helper这一套它通常配合插件实现了类似beforeEach的钩子。在thinglinks源码里你找找src/permission.ts或者类似的拦截器文件它会在页面加载前判断权限。4. 目录结构与权限对比表为了让你在 CSDN 上一目了然建议存下这张表功能点后台管理 (Vue Web)uni-app (小程序/App)路由定义router/index.js(JS 定义)pages.json(JSON 配置/自动生成)跳转 APIrouter.push()uni.navigateTo()/uni.switchTab()全局守卫router.beforeEach()uni.addInterceptor()或 框架封装拦截器权限控制动态添加路由 (addRoute)隐藏 TabBar 入口跳转拦截网络请求Axiosuni.request(或封装好的 request.ts)在 uni-app 里你不能像 Web 那样“动态生成路由菜单”你得先把所有页面写死在pages.json里。

更多文章