解决:VUE同一路由强制刷新页面

解决:VUE同一路由强制刷新页面解决:VUE同一路由强制刷新页面

大家好,又见面了,我是你们的朋友全栈君。

1. 思路

  • 使用this.$router.replace(),跳到一个空白页,然后this.$router.replace()重新跳回来
  • 使用this.$router.replace()的原因是,其实跟this.$router.push()效果一样,但是this.$router.replace()不会记录到history里,不留痕迹
  • 甚至不用打开空白页,直接用beforeRouteEnter拦截跳回原来页面

2. 实现过程

2.1 新建一个名为refresh.vue的文件

2.2 在refresh.vue里添加 beforeRouteEnter

<template> </template>
<script>
export default { 
   
  beforeRouteEnter(to, from, next) { 
   
    next(vm => { 
   
      vm.$router.replace(from.path)
      // 跳到该路由页面后,再替换为from.path来源路径
    })
  }
}
</script>

2.3 在路由文件里,加上refresh 的路由

    { 
   
      path: '/refresh',
      component: resolve => require(['@/pages/refresh'], resolve),
      meta: { 
   
        title: '用于同路由刷新'
      }
    }

2.4 当你想刷新当前页面的时候,可以调用下面这段代码

this.$router.replace('/refresh')

over,enjoy!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/157499.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • TLSF内存分配器记录[通俗易懂]

    TLSF内存分配器记录[通俗易懂]论文:《TLSF:aNewDynamicMemoryAllocatorforReal-TimeSystems》这也是Unity底层使用的内存分配器。我直接从论文中间部分开始看。firstlevel存的是每个内存分配大小,从2的四次方到2的31次方。而对应每个大小,又指向一个二级列表,里面被分成4级,每一级的范围认为是同一类。1表示空闲,所以只有2的六次方和2的15次方块是空闲的。再看它指向的二级列表。只有2的六次方+16到2的6次方+32的这个.

    2022年6月26日
    44
  • currentstyle 织梦_织梦arclist标签支持高亮currentstyle属性方法

    currentstyle 织梦_织梦arclist标签支持高亮currentstyle属性方法找到include/taglib/arclist.lib.php第一步:查找:$channelid=$ctag->GetAtt(‘channelid’);替换:$channelid=$ctag->GetAtt(‘channelid’);$currentstyle=$ctag->GetAtt(‘currentstyle’);第二步:查找:$ct…

    2022年7月14日
    13
  • java StringTokenizer

    java StringTokenizerStringTokenizer是一个用来分隔String的应用类,相当于VB的split函数。1.构造函数publicStringTokenizer(Stringstr)publicStringTokenizer(Stringstr,Stringdelim)publicStringTokenizer(Stringstr,Stringdelim,boolean

    2022年8月11日
    4
  • BZOJ4827:[HNOI2017]礼物(FFT)

    BZOJ4827:[HNOI2017]礼物(FFT)

    2022年4月2日
    42
  • Android —facebook/litho框架 超实用的入门干货

    Android —facebook/litho框架 超实用的入门干货可能很多人不知道litho是什么,我这里简单说一下litho就是用代码写布局。嗯,就是那么简单。或许你会问为什么用代码来写呢我xml用的挺好也方便,至于这些问题我都不会回答(坏笑)说了是干货所以肯定以代码为主所以这些介绍我能省就省了。其实网上有很多大神从框架层面介绍了litho的好处和作用,可以解答这些问题。读完之后就知道litho的好处啦。但可惜的是介绍litho用法的文章却是少之又少…

    2025年6月1日
    1
  • Python之sqlite3

    描述Python的数据库模块有统一的接口标准,所以数据库操作都有统一的模式(假设数据库模块名为db):1.用db.connect创建数据库连接,假设连接对象为conn2.如果该数据库操作不需

    2021年12月18日
    38

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号