Vue项目通过注入刷新当前页面

通过provide和inject的使用，实现看起来单页面刷新功能

1.在app.vue页面中通过控制<router-view>的隐藏和展示,实现当前页面的刷新

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

2.在需要刷新的页面注入上面provide的reload，在需要刷新的时候执行this.reload()

export default {
  inject:['reload'],
  computed: {
    language() {
      return this.$store.getters.language
    }
  },
  methods: {
    handleSetLanguage(lang) {
      this.reload()
    }
  }
}