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函数精解示例 '* ...
随机推荐
- [转帖]linux学习问题总结
linux学习问题总结 https://www.cnblogs.com/chenfangzhi/p/10661946.html 学习作者的思路 目录 一.环境变量和普通变量的区别 二.rsyslog和 ...
- Luogu P1080 [NOIP2012]国王游戏
题目 按\(a_i*b_i\)升序排序即可. 证明考虑交换法. 对于排序后相邻的两个人\(i,j(a_ib_i\le a_jb_j)\),设前面的总的积为\(s\),则当前答案为\(\max(\fra ...
- 使用iwebshop開發實現QQ第三方登錄
$appid = "101353491"; $appkey = "df4e46ba7da52f787c6e3336d30526e4"; $redirect_ur ...
- 模板 - 强连通分量 - Kosaraju
Kosaraju算法 O(n+m) vector<int> s; void dfs1(int u) { vis[u] = true; for (int v : g[u]) if (!vis ...
- Linux等操作系统杂谈
这部分基本上都是感性认识,介绍一下发展历史什么的.所以基本上都不是我原创的,转载来源都标记在文中了,如果侵权的话请联系删除 操作系统发展历史吃瓜 <Unix.Windows.Mac OS.Lin ...
- express做登录判断
1)JWT试试 https://github.com/penguinab/express-jwt 2)express session https://github.com/whevether/reac ...
- 万兴神剪手 Wondershare Filmora v9.2.11.6 简体中文版
目录 1. 介绍 2. 简体中文9.2.1.10汉化版下载 3. 安装和激活说明 1. 介绍 万兴神剪手 Filmora 是一款界面简洁时尚.功能强大的视频编辑软件,它是深圳万兴科技公司近年来的代表作 ...
- 实践周java基础软件开发app之五子棋
五子棋人机对战实践项目 总的任务和目标 完成一个人机对战的五子棋项目,基本效果如下: 第一部分 Java绘图原理 1. 基本概念 像素,坐标 第二部分 绘制棋盘 1. 基本思路 在一个JPan ...
- 3U VPX 加固智能计算异构服务器
3U VPX 加固智能计算异构服务器 北京太速科技有限公司在线客服:QQ:448468544 公司网站:www.orihard.com联系电话:15084122580
- centos7进入单用户模式修改root密码
1.开机 按“e”,然后输入init=/bin/sh 2.根据提示按ctrl+x 得如下图: 3.输入mount -o remount,rw / 输入passwd设置新密码.如下图: 4.输 ...