How does vue realize automatic refresh after page operation

In the past half a year, I have been writing PC pages with vue, and the content in this article is the actual problems encountered in the actual development process.

It needs to be set in the app.vue file according to the following code

<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>

<style> 
html,
body {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
}
#app {
    font-family: "Avenir", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #2c3e50;
    widows: 100%;
    height: 100%;
}
</style>

Then in the export default of the specific page, add the following line of settings

inject:['reload'],

 Then after the other interfaces are called, execute the following statement, that is, after what operation you want to refresh the reloaded page, add the following line of code

this.reload()

What is actually executed is the created() statement on your page to create the page