beforeRouterEnter与replace的使用
这次使用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的使用的更多相关文章
- <JavaScript语言精粹>--<读书笔记三>之replace()与正则
今天有人问我repalce(),他那个题目很有意思.我也不会做,于是我就去查,结果发现就是最基础的知识的延伸. 所以啊最基础的知识才是很重要的,千万不能忽略,抓起JS就写代码完全不知到所以然,只知道写 ...
- 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 ...
- js的replace函数入参为function时的疑问
近期在写js导出excel文件时运用到replace方法,此处详细的记录下它各个参数所代表的的意义. 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式 ...
- ORACLE 利用 REPLACE函数替换字段字符串
REPLACE(string,s1,s2) string 希望被替换的字符或变量 s1 被替换的字符串 s2 要替换的字符串 SQL> select replace(he love you,he ...
- js 页面刷新location.reload和location.replace的区别小结
reload 方法,该方法强迫浏览器刷新当前页面. 语法: location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前 ...
- replace和translate的用法
select replace ('111222333444','222','888') from dual;with tmp as(select 'aabb/123\:cde工人' s from du ...
- JavaScript replace() 方法
参考:http://www.w3school.com.cn/jsref/jsref_replace.asp 需要有一点注意的是:可以是函数的形式做为返回值,如下: "test{0}" ...
- replace实现正则过滤替换非法字符
html+js结构如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...
- Replace 删除、替换函数精解示例
'************************************************************************* '**模 块 名:Replace函数精解示例 '* ...
随机推荐
- gRPC编译教程
windows平台的编译 一.编译openssl ① 安装perl(可以使用ActivePerl),执行perl Configure VC-WIN64A no-asm .在这里解释一下参数含义,VC- ...
- Dango之初识安装
1. MVC和MTV框架 1.1MVC Web服务器开发领域里著名的MVC模式 所谓MVC就是把Web应用分为模型(M), 控制器(C)和视图(V)三层,他们之间以一种插件式的.松耦合的方式连接在一起 ...
- E - 秋实大哥与战争
秋实大哥与战争 Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) Submit S ...
- 开源消息服务中间件ActiveMQ安装部署
1.下载ActiveMQ 去官方网站下载:http://activemq.apache.org/ 2.运行ActiveMQ 解压缩apache-activemq-5.5.1-bin.zip 启动Act ...
- wex5 如何使用蓝牙 ble
使用蓝牙插件 需要在js中添加 require("cordova!cordova-plugin-ble-central"); ble插件具体文档: http://docs.we ...
- splice方法
此方法有三种用法: 第一种: 删除功能 返回删除内容 索引从0开始 var arr = [1,2,3,4]; var arr2 = arr.splice(0,2); arr2 ===> [1, ...
- python-文件操作2(读写文件的详细操作)
python-文件操作2(读写文件的详细操作) 1.读取文件的前6行数据 f = open ("my-hert2","r") #encoding="u ...
- php 简单删除提示
下面是别的网友整理的,大同小异.一般通过弹出确认按钮来判断是否继续进入下面的删除页面. 第一种: <a href="javascript:if(confirm('确认删除吗?'))wi ...
- jmeter之Ramp-up Period(in seconds)
[1]决定多长时间启动所有线程.如果使用10个线程,ramp-up period是100秒,那么JMeter用100秒使所有10个线程启动并运行.每个线程会在上一个线程启动后10秒(100/10)启动 ...
- 折半搜索+Hash表+状态压缩 | [Usaco2012 Open]Balanced Cow Subsets | BZOJ 2679 | Luogu SP11469
题面:SP11469 SUBSET - Balanced Cow Subsets 题解: 对于任意一个数,它要么属于集合A,要么属于集合B,要么不选它.对应以上三种情况设置三个系数1.-1.0,于是将 ...