Vue刷新页面的三种方式

1.原生的js刷新方式：

location.reload(); 

2.vue自带的路由跳转方式：

this.$router.go(0); 

使用过后发现这俩种方式都会使页面有短暂的空白，体验效果不是特别好所以总结出了第三种方式
3. 在app或者路由插槽处声明以下代码：

template>     <div id="app">     	<router-view v-if="isShow"></router-view> 	</div> </template> <script>     export default {         name: 'App',         provide () {         //父组件中通过provide来提供变量，在子组件中通过inject接受。                                                          return {                 reload: this.reload                                                           }         },         data() {             return{             //自定义参数                 isShow: true             }         },         methods: {             reload () {             //reload方法首先将isShow设置为false，将router-view通过if判断取消                 this.isShow= false;             // Vue.nextTick用于延迟执行一段代码，它接受2个参数（回调函数和执行回调函数的上下文环境），如果没有提供回调函数，那么将返回promise对象。                 this.$nextTick(function () {            //     在页面更新后再将isShow设置为true                     this.isShow= true;                 })              }         }，     } </script> 

组件中设置刷新

export default {     inject:['reload'],//  此处引入在app中定义的reload方法     data () {         return {         }     } }, 

在页面中需要页面刷新的地方调用即可

this.reload();