之前,为了实现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拦截器的简单使用的更多相关文章

  1. vue axios拦截器 + 自编写插件 实现全局 loading 效果;

    项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...

  2. Java结合SpringBoot拦截器实现简单的登录认证模块

    Java结合SpringBoot拦截器实现简单的登录认证模块 之前在做项目时需要实现一个简单的登录认证的功能,就寻思着使用Spring Boot的拦截器来实现,在此记录一下我的整个实现过程,源码见文章 ...

  3. springmvc拦截器的简单了解

    1.定义一个拦截器 2.在springmvc.xml中配置拦截器. (1)拦截器拦截的请求是建立在前端控制器配置之下的,若DispatcherServlet拦截的是*.action,则拦截器即使配置 ...

  4. Vue Router的入门以及简单使用

    Vue Router 是Vue官方的路由管理器,是Vue用来实现SPA的插件.它和 Vue.js 的核心深度集成,让构建单页面应用(SPA)变得易如反掌. 基本概念: 路由:是一种映射关系,是 “pa ...

  5. vue --- axios拦截器+form格式请求体

    在vue2.x中使用CLI生成的模板有很大改变,需要自己手动在main.ts同级目录下新建interceptors.ts interceptors.ts import axios from 'axio ...

  6. vue interceptors(拦截器)

    拦截器 顾名思义: 就是半路个您劫持, 拦截器 其实在项目和自己写demo中,总会遇到请求方面需要在请求头里面做判断或者添加一些东西, 这时候 vue 中应用中axios的 interceptors  ...

  7. vue axios 拦截器

    前言 项目中需要验证登录用户身份是否过期,是否有权限进行操作,所以需要根据后台返回不同的状态码进行判断. 第一次使用拦截器,文章中如有不对的地方还请各位大佬帮忙指正谢谢. 正文 axios的拦截器分为 ...

  8. vue 路由拦截器和请求拦截器

    路由拦截器 已路由为导向 router.beforeEach((to,from,next)=>{ if(to.path=='/login' || localStorage.getItem('to ...

  9. SpringMVC学习笔记九:拦截器及拦截器的简单实用

    SpringMVC中的interceptor拦截器是非常重要的,它的主要作用就是拦截指定的用户请求,并进行相应的预处理和后处理. 拦截时间点在"处理器映射器根据用户提交的请求映射出所要执行的 ...

随机推荐

  1. php框架之odp(一)

    熟悉odp框架的使用已经快一个月了,今天总结一下.odp和yii都是成熟的常用的php框架,因为odp是公司内部开发的,且公司内部用odp的较多,所以我就从odp框架入手.仅仅纪录自己的学习体会 一. ...

  2. 奋斗STM32V3版ADC例程

    https://wenku.baidu.com/view/a60b2042c850ad02de8041b7.html

  3. PE病毒初探——向exe注入代码

    PE文件其实就是Windows可执行文件,关于它的一些简要介绍摘自百度: PE文件被称为可移植的执行体是Portable Execute的全称,常见的EXE.DLL.OCX.SYS.COM都是PE文件 ...

  4. java.lang.NoSuchFieldError: No static field abc_ic_ab_back_mtrl_am_alpha of type I in class Landroid/support/v7/appcompat/R$drawable

    出现java.lang.NoSuchFieldError: No static field abc_ic_ab_back_mtrl_am_alpha of type I in class Landro ...

  5. (笔记)Linux内核学习(一)之内核介绍

    内核与操作系统: 内核是操作系统的核心部分,包含了系统运行的核心过程,决定系统的性能,操作系统启动内核被装入到RAM中: 操作系统与底层硬件设备交互和为运行应用程序提供执行环境. Linux内核与微内 ...

  6. 嵌入式开发之hi3519---GPIO 按键驱动

    摸索了一个星期,终于把海思HI3515开发板的按键中断程序搞出来了,hi3515的核心芯片与网上例子较多的s3c之类的有一些区别,以至于浪费了好些时间去琢磨.管脚配置方式不一样,中断的使用情况也不一样 ...

  7. Android TextView文字空格

     表示全角空格, <string name="aaa">你好      啊</string> http://stackoverflow.com/questi ...

  8. Python 函数(默认参数)

    默认参数 设置默认参数时,有两点需要注意:一是必选参数在前,默认参数在后,否则python的解释器会报错二是当函数有多个参数时,把变化大的参数放前面,变化小的放后面,变化小的参数就可以作为默认参数 d ...

  9. MTK 修改默认屏幕亮度

    frameworks\base\packages\SettingsProvider\res\values\defaults.xml <!-- Default screenbrightness, ...

  10. jenkins之 pipeline 小尝试

    最近,一个小需求,动态建立slave节点来执行自动化用例,原有jenkins 老方式不满足需求,就用到jenkins2的pipeline来实现,但在实现过程中,2个小坑记录下 1.jenkins不能读 ...