vue router拦截器的简单使用
之前,为了实现router跳转的每个页面的url上都带上addressCode,然后用了一下router拦截器,很好用,当然也可以专门封装一个方法来实现(跳转的页面上带有addressCode),不过还是感觉router拦截器比较省事。
router拦截器就是在路由跳转前后,做一些事情,相当于一个钩子函数。
下面说一下使用方法:
1、在main.js里 引入router
import router from "./router/router";
2、要在 vue实例前写入
//注册一个全局前置守卫,确保要调用 next 方法,否则钩子就不会被 resolved
router.beforeEach((to, from, next) => {
//路由切换时,如果没有就添加,有就跳过执行,添加固定参数
if (!to.query.addressCode) {
//准备一个跳转的query对象
let query = to.query
query.addressCode = tool.getAddressCode();//是一个封装好的获取addressCode的方法
alert.eduToast('没'+query.addressCode,6000);//调试代码
next({
path: to.path,
query: query
})
} else {
if (to.path !== window.location.pathname) {
// 此处不可使用location.replace
window.location.assign(to.fullPath)
} else {
next()
}
alert.eduToast('有',6000);//调试代码
}
})
vue router拦截器的简单使用的更多相关文章
- vue axios拦截器 + 自编写插件 实现全局 loading 效果;
项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...
- Java结合SpringBoot拦截器实现简单的登录认证模块
Java结合SpringBoot拦截器实现简单的登录认证模块 之前在做项目时需要实现一个简单的登录认证的功能,就寻思着使用Spring Boot的拦截器来实现,在此记录一下我的整个实现过程,源码见文章 ...
- springmvc拦截器的简单了解
1.定义一个拦截器 2.在springmvc.xml中配置拦截器. (1)拦截器拦截的请求是建立在前端控制器配置之下的,若DispatcherServlet拦截的是*.action,则拦截器即使配置 ...
- Vue Router的入门以及简单使用
Vue Router 是Vue官方的路由管理器,是Vue用来实现SPA的插件.它和 Vue.js 的核心深度集成,让构建单页面应用(SPA)变得易如反掌. 基本概念: 路由:是一种映射关系,是 “pa ...
- vue --- axios拦截器+form格式请求体
在vue2.x中使用CLI生成的模板有很大改变,需要自己手动在main.ts同级目录下新建interceptors.ts interceptors.ts import axios from 'axio ...
- vue interceptors(拦截器)
拦截器 顾名思义: 就是半路个您劫持, 拦截器 其实在项目和自己写demo中,总会遇到请求方面需要在请求头里面做判断或者添加一些东西, 这时候 vue 中应用中axios的 interceptors ...
- vue axios 拦截器
前言 项目中需要验证登录用户身份是否过期,是否有权限进行操作,所以需要根据后台返回不同的状态码进行判断. 第一次使用拦截器,文章中如有不对的地方还请各位大佬帮忙指正谢谢. 正文 axios的拦截器分为 ...
- vue 路由拦截器和请求拦截器
路由拦截器 已路由为导向 router.beforeEach((to,from,next)=>{ if(to.path=='/login' || localStorage.getItem('to ...
- SpringMVC学习笔记九:拦截器及拦截器的简单实用
SpringMVC中的interceptor拦截器是非常重要的,它的主要作用就是拦截指定的用户请求,并进行相应的预处理和后处理. 拦截时间点在"处理器映射器根据用户提交的请求映射出所要执行的 ...
随机推荐
- 【emWin】例程二十八:窗口对象——Menu
简介: MENU 小工具可用于创建若干种菜单.每个菜单项代表一个应用程序命令或 子菜单.MENU 可水平显示和/ 或垂直显示.菜单项可使用分隔符进行分组.水 平菜单和垂直菜单均支持分隔符.选择一个菜单 ...
- Thrift源码学习二——Server层
Thrift 提供了如图五种模式:TSimpleServer.TNonblockingServer.THsHaServer.TThreadPoolServer.TThreadSelectorServe ...
- 使用Fidder将生成环境代码映射到本地(文件夹)
匹配生产URL正则表达式 regex:http://www.a.com/statics/js/(.*) 本地路径配置 D:\web\statics\js\$1
- 如何搭建WebRTC信令服务器
WebRTC 有一整套规范,如怎样使用它的接口.使用SDP进行媒体协商.通过ICE收集地址并进行连通性检测等等.除此之外,WebRTC还需要房间服务器将多端聚集到一起管理,以及信令服务器进行信令数据交 ...
- Virtualbox的centos7 nat和桥接网络配置
在实际配置虚拟机的过程中,网络配置时候一个很繁琐的过程,经常一个点没注意到,就访问不了了.在此,做一个简单的教程以供后续使用时可以参考! 方法一: 使用NAT网络 1. 选择网卡 安装centos7的 ...
- yum常用命令大全
yum命令是在Fedora和RedHat以及SUSE中基于rpm的软件包管理器,它可以使系统管理人员交互和自动化地更细与管理RPM软件包,能够从指定的服务器自动下载RPM包并且安装,可以自动处理依赖性 ...
- .Net Framework4.5.2 源码命名空间简析
Miscosoft目前除.Net Core开源外,对于.Net4.5.1 , 4.5.2等后续版本同样开源.资源中包含sln,csproj等以方便我们在vs中打开它们,不过我们不能编译它,因为它缺少r ...
- spring boot mybatis 整合教程
本项目使用的环境: 开发工具:Intellij IDEA 2017.1.3 springboot: 1.5.6 jdk:1.8.0_161 maven:3.3.9 额外功能 PageHelper 分页 ...
- Linux内核之旅
http://www.kerneltravel.net/ Linux内核之旅 Linux Kernel Travel
- 转载]PhpCms V9调用指定栏目子栏目文章的两种方法
PhpCms V9调用指定栏目子栏目文章的两种方法 第一种.直接写子栏目id ,用cat in {pc:get sql="SELECT * from v9_news where status ...