vue中的路由独享守卫的理解
1.vue中路由独享守卫意思就是对这个路由有一个单独的守卫,因为他的守卫方式于其他的凡是不太同
独享守卫于前置守卫使用方法大致是一样的
- 在路由配置的时候进行配置,
{
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中的路由独享守卫的理解的更多相关文章
- Vue路由守卫之路由独享守卫
路由独立守卫,顾名思义就是这个路由自己的守卫任务,就如同咱们LOL,我们守卫的就是独立一条路,保证我们这条路不要被敌人攻克(当然我们也得打团配合) 在官方定义是这样说的:你可以在路由配置上直接定义 ...
- vue路由独享守卫beforeEnter
在某个路由中,使用beforeEnter()方法,参数是to,from,next 和全局路由守卫的用法是一样的 例子: import Vue from 'vue' import Router from ...
- [Vue]导航守卫:全局的、单个路由独享的、组件级的
正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航.有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的. 记住参数或查询的改变并不会触发进入/离开的 ...
- vue组件独享守卫钩子函数参数详解(beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave)
一样的和前面路由钩子类似的步骤 首先在demo下面的components下面新建一个test.vue组件 test组件代码 <template> <div class="t ...
- vue中的路由的跳转的参数
vue中的路由跳转传参 params 与 query this.$router.push({ name:"detail", params:{ name:'nameValue', c ...
- vue 中的路由为什么 采用 hash 路由模式,而不是href超链接模式(Hypertext,Reference)?
1. vue中路由模式的种类有两种 1. 一种是 hash 模式. 2. 一种是 h5 的 history 模式. 2. hash 和 history 都是来自 bom 对象 bom 来自 windo ...
- Vue中的路由 以及默认路由跳转
https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...
- vue中config/index.js:配置的详细理解
当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面 (环境变量及其基本变量的配置) var path = require('path') ...
- 5分钟学会vue中的路由守卫(导航守卫)
在项目开发中每一次路由的切换或者页面的刷新都需要判断用户是否已经登录,前端可以判断,后端也会进行判断的,我们前端最好也进行判断. vue-router提供了导航钩子:全局前置导航钩子 beforeEa ...
随机推荐
- 鼠标移上去触动hover致使div向上移动几个相素(动画transition轻轻的移动)
- Struts2把数据封装到集合中之封装到Collection中
数据封装到集合中,可以封装到集合中,也可以封装到Map中.该篇博客主要讲解数据封装到集合中的封装到Collection中. 1. 封装复杂类型的参数(集合类型 Collection .Map接口等) ...
- git bug修复
在Git中,由于分支是如此的强大,所以,每个bug都可以通过一个新的临时分支来修复,修复后,合并分支,然后将临时分支删除. 当你接到一个修复一个代号101的bug的任务时,很自然地,你想创建一个分支i ...
- 关系测试# 或 print(s2-s)Python 集合
1集合是一个无序的,不重复的数据组合,它的主要作用如下(set和dict类似,也是一组key的集合,但不存储value.由于key不能重复,所以,在set中,没有重复的key): 去重,把一个列表变成 ...
- hdu 5493 (2015合肥网赛) Queue
题目;http://acm.hdu.edu.cn/showproblem.php?pid=5493 题目大意,t组数据,n个人,n行每行分别是人的身高和这个人的左边或右边比他高的人的个数,输出符合条件 ...
- win10安装.net3.5
近日有网友反映在windows10_64位系统电脑上安装Net framework3.5,操作时总失败,怎么办呢?小编下面就介绍win10 64位系统无法安装Net framework3.5的两种解决 ...
- spring自动注解Autowired配置
1.spring注解:http://blog.csdn.net/xyh820/article/details/7303330/ 2.最简ssm配置:http://blog.csdn.net/qq_18 ...
- 10个办法让设计小白迅速get海报设计要点!
对于设计师而言,海报和宣传单的设计,几乎是每一个设计师的必修课.如今网页上的 Banner.宣传和促销的数字海报,大多脱胎于我们所熟知的海报设计. 对于推销产品.连接客户,海报始终是一种最为有趣和实用 ...
- [Robot Framework] 校验字符串中是否包含某个子字符串,校验同时满足两个条件中任意一个
${tWarningMessage} Run Keyword If ${tIfExist} AutoItLibrary.Win Get Text Generate Fee Data warning m ...
- Python Numpy中transpose()函数的使用
在Numpy对矩阵的转置中,我们可以用transpose()函数来处理. 这个函数的运行是非常反常理的,可能会令人陷入思维误区. 假设有这样那个一个三维数组(2*4*2): array ([[[ 0, ...