vue refresh the current page, without a white

The project may need to refresh the needs of the current page
generally have these types of methods to refresh the current page

1，history.go(0)
2，location.reload()
3，location=location
4，location.assign(location)
5，document.execCommand(‘Refresh’)
6，window.navigate(location)
7，location.replace(location)
8，document.URL=location.href

But these types will appear white screen, the user experience is poor

**

Recommended Solution:

**
a combination provide / inject

Rationale: Allows a component dependent on an ancestor to all future generations injection, no matter how deep the component level, and in the upstream and downstream relations since the establishment of the time and always take effect

In App.vue, the statement reload method, control router-view display or hide, so as to control the page is loaded again.

<template>
  <div id="app">
    <router-view v-if="isRouterAlive"></router-view>
  </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>

The need to use to refresh the page. In reload the page depend injection App.vue component provides (provide), and after the completion of logic (delete or add ...), direct this.reload () call, you can refresh the current page.

Reload injection method

	inject::['reload']

export default {
	name:"header",
	inject::['reload'],      //重点！！！！
	data(){
		return{

		}
	}
}

transfer:

this.reload()

Note that this point