vue 局部刷新

1、在APP.vue中写入

<template>
   <div id="app">
   <!--v-if控制组件的更新渲染-->
      <router-view v-if="isRouterlive" />
   </div>
</template>

<script>
export default {
	//父组件给子孙提供一个方法，在需要使用局部刷新的组件中引入
   provide() {
      return {
         reload: this.reload
      };
   },
   data() {
      return {
         isRouterlive: true
      };
   },
   methods: {
   //写函数方法
      reload() {
         this.isRouterlive = false;
         this.$nextTick(_ => {
            this.isRouterlive = true;
         });
      }
   }
};
</script>
2、在需要局部更新的组件中中写入
<template>
   <div class="">
   		<button @click=“btn”>刷新</button>

   </div>
</template>
<script>
export default {
	//子孙组件注入app.vue中的刷新方法
   inject: ["reload"],
   data() {
      return {
      };
   },
   methods: {
   //调用
      btn() {
         this.reload()
      }
   }
};
</script>