这次使用beforeRouterEnter来判断是一定条件下才执行相应的页面跳转。

beforeRouterEnter:组件内路由,跟data,methods同级

 beforeRouteEnter (to, from, next) {
// 在渲染该组件的对应路由被 confirm 前调用
// 不!能!获取组件实例 `this`
// 因为当守卫执行前,组件实例还没被创建
}, 需求场景:
  一个stuInfo页面,只有第一次才会出现,一旦出现过,以后再也不会出现,即使是输入该页面的url也不会跳转到该页面,只会跳转到指定的其他页面; 代码如下:
beforeRouteEnter (to, from, next) {
next(vm=>{
if(vm.profileCompleted){
vm.nextReplace()
}
}),
methods: {
nextReplace(){
this.$router.replace("/")
}
}

思路:

  在第一次进入stuInfo页面填写完信息提交成功后,把一个成功的状态存储到vuex中,上面代码中profileComplete就是这个状态,然后在该页面中通过beforeRouterEnter判断vuex中存储的状态来确定是不是第一次进入该页面,在beforeRouterEnter中不能使用this,只可以使用next函数中的实例来找到vue的实例拿取状态,要想跳转到其他地方就需要在methods中单独定义一个跳转的方法,通过next找到实例调用方法。

 

beforeRouterEnter与replace的使用的更多相关文章

  1. <JavaScript语言精粹>--<读书笔记三>之replace()与正则

    今天有人问我repalce(),他那个题目很有意思.我也不会做,于是我就去查,结果发现就是最基础的知识的延伸. 所以啊最基础的知识才是很重要的,千万不能忽略,抓起JS就写代码完全不知到所以然,只知道写 ...

  2. StackOverFlow排错翻译 - Python字符串替换: How do I replace everything between two strings without replacing the strings?

    StackOverFlow排错翻译 - Python字符串替换: How do I replace everything between two strings without replacing t ...

  3. js的replace函数入参为function时的疑问

    近期在写js导出excel文件时运用到replace方法,此处详细的记录下它各个参数所代表的的意义. 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式 ...

  4. ORACLE 利用 REPLACE函数替换字段字符串

    REPLACE(string,s1,s2) string 希望被替换的字符或变量 s1 被替换的字符串 s2 要替换的字符串 SQL> select replace(he love you,he ...

  5. js 页面刷新location.reload和location.replace的区别小结

    reload 方法,该方法强迫浏览器刷新当前页面. 语法: location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前 ...

  6. replace和translate的用法

    select replace ('111222333444','222','888') from dual;with tmp as(select 'aabb/123\:cde工人' s from du ...

  7. JavaScript replace() 方法

    参考:http://www.w3school.com.cn/jsref/jsref_replace.asp 需要有一点注意的是:可以是函数的形式做为返回值,如下: "test{0}" ...

  8. replace实现正则过滤替换非法字符

    html+js结构如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...

  9. Replace 删除、替换函数精解示例

    '************************************************************************* '**模 块 名:Replace函数精解示例 '* ...

随机推荐

  1. springboot - 应用实践(2)第一个springboot应用

    1.使用maven创建一个快速启动项目 2.引入相关依赖 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:x ...

  2. BZOJ 1053 反素数 题解

    题面 引理1:  1~n中的最大反质数,就是1~n中约数个数最多的数中最小的一个(因为要严格保证g(x)>g(i)): 引理2:1~n中任何数的不同因子不会超过10个,因为他们的乘积大于2,00 ...

  3. C++中的自定义内存管理

    1,问题: 1,new 关键字创建出来的对象位于什么地方? 1,位于堆空间: 2,有没有可能位于其它地方? 1,有: 2,通过一些方式可以使动态创建的对象位于静态存储区: 3,这个存储区在程序结束后释 ...

  4. Android API文档

    官方API文档: Android官网: https://developer.android.google.cn/index.html (不需要梯子) Android官网: https://develo ...

  5. List<HashMap<String,String>> list, 根据hashmap中的某个键的值排序

    来源https://blog.51cto.com/zhaodan/1725249 //可以使用Collections.sort(List list, Comparator c)来实现 这里举例hash ...

  6. HNUSTOJ-1621 Picking Cabbage(状态压缩DP)

    1621: Picking Cabbage 时间限制: 2 Sec  内存限制: 32 MB提交: 26  解决: 14[提交][状态][讨论版] 题目描述 Once, Doraemon and  N ...

  7. 关于 Spring AOP (AspectJ) 你该知晓的一切 (转)

    出处:关于 Spring AOP (AspectJ) 你该知晓的一切

  8. 什么是RESTful API、WSGI、pecan

    RESTful API REST的全称是Representational State Transfer(表征状态转移), 是Roy Fielding在他的博士论文Architectural Style ...

  9. lnmp1.4 nginx配置thinkphp5

    vhost/xxx.conf配置图,重点是红色框框 研究了两三天 ,至此thinkphp5 路由,隐藏index.php全部解决 感谢网友的分享:http://blog.csdn.net/gaoxiu ...

  10. 1.javascript知识点总结

    1.写javaScript的三种方式: 2.写javaScript的注意事项: ①严格区分字母的大小写: ②空格和换行.多余的空格会被忽略,可以将一行代码分成多行写: ③分号作为一个语句的结束: ④单 ...