使用this.$router.replace()，跳到一個空白頁，然后this.$router.replace()重新跳回來
使用this.$router.replace()的原因是，其實跟this.$router.push()效果一樣，但是this.$router.replace()不會記錄到history里，不留痕跡
甚至不用打開空白頁，直接用beforeRouteEnter攔截跳回原來頁面

2. 實現(xiàn)過程

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 當(dāng)你想刷新當(dāng)前頁面的時候，可以調(diào)用下面這段代碼

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

over，enjoy！

到此這篇關(guān)于VUE同一路由強制刷新頁面的文章就介紹到這了,更多相關(guān)vue路由強制刷新頁面內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

深入探索VueJS Scoped CSS 實現(xiàn)原理
這篇文章主要介紹了深入探索VueJS Scoped CSS 實現(xiàn)原理，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
vue如何實現(xiàn)垂直居中
這篇文章主要介紹了vue如何實現(xiàn)垂直居中，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-09-09
vue.js多頁面開發(fā)環(huán)境搭建過程
利用 vue-cli 搭建的項目大都是單頁面應(yīng)用項目，對于簡單的項目，單頁面就能滿足要求。這篇文章主要介紹了vue.js多頁面開發(fā)環(huán)境搭建 ,需要的朋友可以參考下
2019-04-04
基于Vue和Firebase實現(xiàn)一個實時聊天應(yīng)用
在本文中,我們將學(xué)習(xí)如何使用Vue.js和Firebase來構(gòu)建一個實時聊天應(yīng)用,Vue.js是一種流行的JavaScript前端框架,而Firebase是Google提供的實時數(shù)據(jù)庫和后端服務(wù),結(jié)合這兩者,我們可以快速搭建一個功能強大的實時聊天應(yīng)用,需要的朋友可以參考下
2023-08-08
Vue render函數(shù)使用詳細(xì)講解
vue中的render函數(shù),它返回的是一個虛擬節(jié)點vnode,也就是我們要渲染的節(jié)點,下面這篇文章主要給大家介紹了關(guān)于Vue中render函數(shù)的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-01-01
Vue如何使用Element-ui表單發(fā)送數(shù)據(jù)與多張圖片到后端詳解
在做項目的時候遇到一個問題,前端需要上傳表單到后端,表單數(shù)據(jù)包括文本內(nèi)容和圖片,這篇文章主要給大家介紹了關(guān)于Vue如何使用Element-ui表單發(fā)送數(shù)據(jù)與多張圖片到后端的相關(guān)資料,需要的朋友可以參考下
2022-04-04
詳解vue2.0模擬后臺json數(shù)據(jù)
這篇文章主要介紹了vue2.0模擬后臺json數(shù)據(jù)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-05-05
Vue+Element UI+Lumen實現(xiàn)通用表格分頁功能
這篇文章主要介紹了Vue+Element UI+Lumen實現(xiàn)通用表格分頁功能，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-02-02
vue.js引入外部CSS樣式和外部JS文件的方法
這篇文章主要介紹了vue.js引入外部CSS樣式和外部JS文件的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2019-01-01
在vue項目中使用md5加密的方法
這篇文章主要介紹了在vue項目中使用md5加密的方法,需要的朋友可以參考下
2018-09-09