vue.js项目中重新加载当前页面的方法

一.业务场景

1.在处理完编辑或者删除按钮时，需要有当前页面重新加载的需求。

二.解决方法

provide/inject的组件组合
具体使用方法:
1.在前端vue项目App.vue中添加如下代码

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

2.在index页面的使用：
        在页面注入App.vue组件提供（provide）的 reload 依赖，如下面代码块:inject:[‘reload’]。在逻辑完成之后（删除或添加…）,在methods中直接this.reload()调用，即可重新加载当前页面。

<script>
export default {
  name: 'index.vue',
  components:{xxx,xxx,xxx},
  inject: ['reload'],
  methods:{
		getTableData:function(){
      		this.reload()
 }
</script>

项目使用亲测有效。