使用场景:

  组件复用;路由跳转;

beforeRouteUpdate (to, from, next) {
// 在当前路由改变,但是该组件被复用时调用
// 举例来说,对于一个带有动态参数的路径 /foo/:id,在 /foo/1 和 /foo/2 之间跳转的时候,
// 由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
// 可以访问组件实例 `this`
},
export default{
data(){
return {}
},
beforeRouteUpdate(to,from,next){
console.log(to,from,next)
if(to.fullPath!=from.fullPath){
next()
this.changeUser()
}
},
methods:{
changeUser(){
getUserBaseInfo({userId:this.$route.params.id}).then(res=>{
if(res.success){
this.stuInfo = res.data;
}else{
this.$message.error(res.message)
} })
}
}
}

组件内导航之beforeRouteUpdate的使用的更多相关文章

  1. [Flex] ButtonBar系列——arrowKeysWrapFocus属性如果为 true,则使用箭头键在组件内导航时,如果击中某一端则将折回。

    <?xml version="1.0" encoding="utf-8"?> <!--arrowKeysWrapFocus 如果为 true, ...

  2. Vue(基础八)_导航守卫(组件内的守卫)

    一.前言 主要通过一个例子演示三个钩子的作用: 1.beforeRouteEnter()                                                         ...

  3. vue-router之路由钩子(组件内路由钩子必须在路由组件调用,子组件没用)

    模式 vue-router中的模式选项主要在router实例化的时候进行定义的,如下 const router = new VueRouter({ mode: 'history', // 两种类型hi ...

  4. Jetpack系列:应用内导航的正确使用方法

    今天小编要分享的还是Android Jetpack库的基本使用方法,本篇介绍的内容是Jetpack Navigation组件,让我们一起学习,为完成年初制定的计划而努力吧! *** 组件介绍 导航,是 ...

  5. 解决vue组件内前置路由守卫beforeRouteEnter无法获取上下文this

    问题描述 vue框架,只有在报名页面报名成功,然后自动跳转到订单详情,才弹出一个引流弹窗,其他情况均不弹出,我就想到使用vue 的组件内前置守卫beforeRouteEnter来实现.beforeRo ...

  6. Nuxt内导航栏的两种实现方式

    方式一 | 通过嵌套路由实现 在pages页面根据nuxt的路由规则,建立页面 1. 创建文件目录及文件 根据规则,如果要创建子路由,子路由的文件夹名字,必须和父路由名字相同 所以,我们的文件夹也为i ...

  7. Win10 UWP 开发系列:使用SplitView实现汉堡菜单及页面内导航

    在Win10之前,WP平台的App主要有枢轴和全景两种导航模式,我个人更喜欢Pivot即枢轴模式,可以左右切换,非常方便.全景视图因为对设计要求比较高,自己总是做不出好的效果.对于一般的新闻阅读类Ap ...

  8. Windows Store App JavaScript 开发:页内导航

    页内导航是在一个页面内根据需要加载其他页面的内容,在开发基于JavaScript的Windows应用商店应用时,可以使用WinJS.Navigation.navigate函数传递要加载的页面地址并使用 ...

  9. 『Asp.Net 组件』Asp.Net 服务器组件 内嵌JS:让自己的控件动起来

    代码: using System; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace ...

随机推荐

  1. JNDI的初步理解

    1.JDNI是什么意思? 答:JNDI是 java naming and directory interface 的缩写,是j2ee开发中的一种重要的规范 2.JNDI有什么用? 答:如果没有JNDI ...

  2. gcc数据对齐之: howto 1.

    GCC支持用__attribute__为变量.类型.函数.标签指定特殊属性.这些不是编程语言标准里的内容,而属于编译器对语言的扩展. 本文介绍其中的两个属性:aligned和packed. align ...

  3. 手把手 教你把H5页面打造成windows 客户端exe 软件

    序言: 好久没有更新博客了,最近在工作中碰到这种需求,由于没有做过,中间碰到好多坑,最后在一位贵人帮助的情况下,最终还是搞定了. 第一步,先安装 cefpython3 pip install cefp ...

  4. mysql元数据以及一些常用命令

    所谓mysql元数据就是一些初始的东西,例如数据库的列表,数据表列表,查询影响的行数等等,还有就是mysql的服务器的一些信息,例如版本信息等. select version(): 获取mysql服务 ...

  5. 基于Spring Cloud 几行配置完成单点登录开发

    单点登录概念 单点登录(Single Sign On),简称为 SSO,是目前比较流行的企业业务整合的解决方案之一.SSO的定义是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统. ...

  6. 使用油猴子 greasemonkey xx 百度 ...

    百度首页在登录以后很恶心 没事弹出点垃圾新闻来污染眼球 搜索结果右下角的今日排行榜也是没事就出现垃圾的东西 所以让我们也xx一下百度.. // ==UserScript== // @name 清理百度 ...

  7. MySQL 7种 JOIN连表方法

    规定:左边的圆代表表 a,右边的代表 b. JOIN 关键字可以在两表之间选中任意部分.] 通过以下代码制造一些数据: delimiter // drop procedure if exists pr ...

  8. ConstantUtils

    public class ConstantUtils { public static final Integer PAGE_SIZE=2; public static final Integer NA ...

  9. WPF C# 字符串读写文件

    WPF C# 字符串读写文件 public class 字符串读写文件 { /// <summary> /// Encoding.Unicode.GetString 如果使用Encodin ...

  10. python 多线程、线程锁、事件

    1. 多线程的基本使用 import threading import time def run(num): print('Num: %s'% num) time.sleep(3) if num == ...