首页 > 其他分享 >uniapp实现路由拦截

uniapp实现路由拦截

时间:2023-10-30 16:57:48浏览次数:37  
标签:uniapp 简书 import onLaunch 跳转 router 拦截 路由

背景

在APP中,跳转页面需要判断是否有权限跳转,比如是否登录。开发环境是TMUI+VUE3+TS,这难免有一些限制,在网上搜索后,发现简书网站有个博主写的链接正合我意,不过他的是JavaScript+uniapp原生开发,根据我的需求,自己稍微改了些。

0x01 复制代码

简书博客链接:https://www.jianshu.com/p/bae4cf971343

0x02在APP.VUE中增加代码

<script lang="ts" setup>
import { onLaunch } from "@dcloudio/uni-app";
import router from "./router/route";

//uniapp的生命周期函数
onLaunch(() => {
  router()
});
</script>

0x03 效果

image-20231030164030310

标签:uniapp,简书,import,onLaunch,跳转,router,拦截,路由
From: https://www.cnblogs.com/xfstu/p/17798233.html

相关文章

  • TP-LINK XDR6088 WiFi6路由器 简单开箱评测
    TL-XDR6088易展版AX6000双频WiFi6路由器简单开箱测评,双2.5G网口,双频8流,8颗FEM,支持Docker。TP-LINKXDR5470WiFi6路由器简单开箱评测:https://blog.zeruns.tech/archives/725.htmlTP-LINKXDR3040WiFi6路由器简单开箱评测:https://blog.zeruns.tech/archives/683.html参数CPU:MT79......
  • XMLHttpRequest拦截请求和响应
    环境:angular实现:拦截请求向请求信息增加字段           拦截响应过滤返回值响应拦截:根据angular使用的XMLHttpRequest将对原本的请求转移到另一个将监听返回事件挂载到另一个世纪发送请求的xml上使用getset将客户端获取的responseText和response按照自己的意......
  • Springboot拦截器的使用
    1.拦截器(Interceptor)在SpringBoot中,拦截器是基于SpringMVC框架的一部分,主要用于对控制器方法进行拦截处理。拦截器是通过实现HandlerInterceptor接口来定义的其中包括三个主要方法:preHandle、postHandle和afterCompletion。1.preHandle方法在进入控制器方法之前执行2.postHan......
  • uniapp项目APP端安卓ios权限检测教程
    导语:在APP的日常开发过程中,权限检测与授权是不可避免的一项重要的功能,下面就简单介绍一下如何检测和授权的方法。目录原理方法实战原理此授权方法主要是依托于HTML5产业联盟的HTML5+规范实现的。HTML5产业联盟官网获取当前操作系统名称可以使用uni.getSystemInf......
  • UniApp实战开发指南:构建跨平台应用的终极选择【UniApp实战】
    UniApp是一个强大的开发框架,可让开发者使用Vue.js构建跨平台应用。本文将介绍UniApp的核心概念和技术深度,并通过一个实例演示如何使用UniApp开发一个简单的待办事项应用。1.介绍UniAppUniApp是DCloud推出的一款基于Vue.js的跨平台开发框架。它允许开发者使用一套代码构建同时运行......
  • ensp 简单配置路由添加ip操作小实例
    ensp简单配置路由添加ip操作displaycu#查看路由器配置displayiprouting-table[x.x.x.x]#查看路由表【和x.x.x.x相关的条】案例一、2个路由器配置ip地址给2个路由器配合ip地址,方法一样ipaddressx.x.x.x.x掩码24(255.225.255.0)1.启动2个路由器,有......
  • UniApp实战技巧:页面导航、数据传递和组件通信,以及资源管理和优化
    UniApp是一个基于Vue.js的开发框架,可以使用它快速构建跨平台的移动应用。本文将介绍UniApp中的一些实战技巧,包括页面导航、数据传递和组件通信。这些技巧可以帮助开发者更好地使用UniApp进行开发。1.页面导航在UniApp中,我们可以使用uni.navigateTo和uni.redirectTo等方法进行页面......
  • SKU规格-uniapp小程序
    <template><viewclass="body"><viewclass="tablist"v-if="isShow"><viewclass="tab"v-for="(Aitem,Aindex)intablist":key="Aindex">......
  • Uniapp中弹窗
    Uniapp中弹窗直接上代码uni.showModal({title:'提示',content:'这是一个自定义按钮文字的模态对话框',confirmText:'自定义确定',//自定义确定按钮的文字cancelText:'自定义取消',//自定义取消按钮的文字success......
  • 路由守卫中的白名单
    在写登录注册的路由守卫的时候,如果直接进行判断,会出现错误router.beforeEach((to,from,next)=>{if(VueCookies.get("token")){next()}else{next("/login")}})  所以要在判断的时候添加白名单,在路由守卫中使用白名单是一种常见的实践,允许你指定哪些路......