vue router跳转页面后刷新 跳转后的页面

一、 背景

点击按钮跳转到新页面，刷新新页面。 用vue-router 重新路由的时候到当前页面的时候是不进行刷新的。如果使用window.reload() 或者router.go(0) hisory.go(0) 刷新的时候整个浏览器进行刷新加载， 但是页面闪烁， 体验不好。

二、解决办法

使用：provide /inject 组合
作用是： 允许一个祖先组件向其所有子孙后代注入一个依赖， 无论组件层次有多深，并在其上下游关系成立时间里始终生效。

<template>
  <div id="app">
    <router-view v-if="isRouterAlive"/>
  </div>
</template>
 
<script>
export default{
  name: 'App',
  provide(){
    return{
        reload:this.reload
    }
  },
  data(){
      return {
        isRouterAlive:true,
      }
  },
  methods:{
    reload(){
        this.isRouterAlive = false;
        this.$nextTick(function () {
          this.isRouterAlive = true
        });
    }
  }
}
</script>

新增配置：

触发跳转页
inject 放在 export default中

跳转方法中添加this.reload();