vue刷新页面的三种方法

一、使用location对象的reload()方法

reload()方法用于刷新当前文档，类似于你浏览器上的刷新页面按钮。

location.reload();

二、使用编程式导航

router.go 被用来作为后退/前进导航

this.$router.go(0); //表示跳转到当前页面

三、使用provide与inject

vue提供了provide和inject帮助我们解决多层次嵌套通信问题。在provide中指定要传递给子孙组件的数据，子孙组件通过inject注入祖父组件传递过来的数据。

1.在app.vue中写入如下代码

<template>
  <div id="app">
    <router-view v-if="isShow"></router-view>
  </div>
</template>

<script>
export default {
  name: 'App',
  provide(){
    return {
      reload:this.reload
    }
  },
  data(){
    return {
      isShow:true
    }
  },
  methods:{
    reload(){
      this.isShow=false;
      this.$nextTick(()=>{
        this.isShow=true;
      })
    }
  }
}
</script>

2.在需要刷新的页面

<script>
	export default {
  		inject:['reload']
  	}

	//需要刷新的地方
	this.reload();
</script>