当需要刷新当前页面时使用location. reload()或者this.$router.go(0)会使页面存在一小段时间的白屏，体验不是很好。

使用provide/inject方式解决白屏问题

在项目的App.vue文件中添加provide

export default {
  components: {},
  provide() {
    return {
      reload: this.reload//向下提供刷新方法
    };
  },
  data() {
    return {
      isRouterAlive: true  
    };
  },
  methods: {
    reload() {
    //通过改变
      this.isRouterAlive = false;
      this.$nextTick(() => {
        this.isRouterAlive = true;
      });
    }
  }
};

在router-view中添加判断从而实现刷新

<router-view v-if="isRouterAlive" />

在需要刷新页面的组件(aaa.vue)注入reload方法

 export default {
 components: {},
  inject: [
   'reload'
 ],
 methods: {
 //刷新方法
   test() {
   this.reload();
 }
};

摘自www.jb51.net/article/151…