1.vue中路由独享守卫意思就是对这个路由有一个单独的守卫,因为他的守卫方式于其他的凡是不太同

独享守卫于前置守卫使用方法大致是一样的

  1. 在路由配置的时候进行配置,
{
path:'/login',
component:Login,
beforeEnter(to,from,next){
to.query.returnURL = from.path;
next();
}
}

2.在登陆界面就是需要返回的页面进行操作

login(){
axios.post('/user/login',this.user).then((res)=>{
localStorage.setItem('token',"Bearer "+res.data.res.token)
const url = this.$route.query.returnURL
// // console.log(this.$route)
this.$router.replace(url)
})
}

rangthis.$router.replace(url),返回到点击进来 的页面,这样就可以实现返回的操作,当时returnURL不会在地址栏上进行显示

vue中的路由独享守卫的理解的更多相关文章

  1. Vue路由守卫之路由独享守卫

    ​ 路由独立守卫,顾名思义就是这个路由自己的守卫任务,就如同咱们LOL,我们守卫的就是独立一条路,保证我们这条路不要被敌人攻克(当然我们也得打团配合) 在官方定义是这样说的:你可以在路由配置上直接定义 ...

  2. vue路由独享守卫beforeEnter

    在某个路由中,使用beforeEnter()方法,参数是to,from,next 和全局路由守卫的用法是一样的 例子: import Vue from 'vue' import Router from ...

  3. [Vue]导航守卫:全局的、单个路由独享的、组件级的

    正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航.有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的. 记住参数或查询的改变并不会触发进入/离开的 ...

  4. vue组件独享守卫钩子函数参数详解(beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave)

    一样的和前面路由钩子类似的步骤 首先在demo下面的components下面新建一个test.vue组件 test组件代码 <template> <div class="t ...

  5. vue中的路由的跳转的参数

    vue中的路由跳转传参 params 与 query this.$router.push({ name:"detail", params:{ name:'nameValue', c ...

  6. vue 中的路由为什么 采用 hash 路由模式,而不是href超链接模式(Hypertext,Reference)?

    1. vue中路由模式的种类有两种 1. 一种是 hash 模式. 2. 一种是 h5 的 history 模式. 2. hash 和 history 都是来自 bom 对象 bom 来自 windo ...

  7. Vue中的路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  8. vue中config/index.js:配置的详细理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  9. 5分钟学会vue中的路由守卫(导航守卫)

    在项目开发中每一次路由的切换或者页面的刷新都需要判断用户是否已经登录,前端可以判断,后端也会进行判断的,我们前端最好也进行判断. vue-router提供了导航钩子:全局前置导航钩子 beforeEa ...

随机推荐

  1. visual studio build and rebuild 的区别

    build 只编译发生改变的dll, (如下, 我只修改了web API,build的时候, 只有webAPI.dll发生更新) rebuild = clean + build (如下, 本项目中dl ...

  2. Debug的使用

    1.什么是Debug? Debug是DOS.Windows都提供的实模式(8086方式)程序的调试工具.使用它,可以查看CPU各种寄存器的内容.内存的情况和在机器码级跟踪程序的运行. 我用的是Mac机 ...

  3. MVC中的七层架构

    工厂模式的七层架构 1.创建Model,实现业务实体. 2.创建IDAL,实现接口. 3.创建DAL,实现接口里的方法. 4.创建DBUtility,数据库操作类5.创建DALFactory,抽象工程 ...

  4. RESTful接口规范

    一. 什么是RESTful REST与技术无关,代表的是一种软件架构风格,REST是Representational State Transfer的简称,中文翻译为“表征状态转移” REST从资源的角 ...

  5. 学习knockoutjs轻量级的MVVM框架

    教程:knockoutjs介绍 http://www.w3cfuns.com/forum.php?mod=viewthread&tid=5598714 MVVM架构~knockoutjs实现简 ...

  6. python学习笔记-Day4(1)

    迭代器 迭代器是访问集合元素的一种方式.迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后退,不过这也没什么,因为人们很少在迭代途中往后退.另外,迭代器的一大优点是 ...

  7. C# 解决SharpSvn启动窗口报错 Unable to connect to a repository at URL 'svn://....'

    在远程机打开sharpsvn客户端测试,结果报错 Svn启动窗口报错 Unable to connect to a repository at URL 'svn://...' 咋整,我在win10我的 ...

  8. 让键盘输入不影响界面的动态效果(C++)

    输入语句,当代码运行到它的时候就要等待输入,才能执行下一行代码,如果不输入的话,就相当于在这里暂停了(程序设计老师讲过通过这样的方式以达到暂停(pause)的效果),但如果我们想要如果没输入仍然可以运 ...

  9. RoCE vs iWARP

    两种以太网 RDMA 协议: iWARP 和 RoCE 转载 2017年03月08日 16:10:09 1510 http://weibo.com/p/1001603936363903889917?m ...

  10. VS2010配置OpenGL开发环境

    OpenGL(Open Graphics Library)是一个跨编程语言.跨平台的专业图形程序接口.OpenGL是SGI公司开发的一套计算机图形处理系统,是图形硬件的软件接口,任何一个OpenGL应 ...