VUE实现局部刷新

首先需要修改App.vue

<template>
  <div id="app">
    <div>
      <router-view v-if="alive" />
    </div>
  </div>
</template>
<script>
  export default {
    name: 'App',
    provide() {
      return {
        reload: this.reload
      }
    },
    data() {
      return {
        alive: true
      }
    },
    methods: {
      reload() {
        this.alive= false
        this.$nextTick(() => {
          this.alive = true
        })
      }
    }
  }
</script>

然后在需要刷新的页面引用，使用inject导入引用reload

 export default {
    inject: ['reload']
    methods: {
      cancel() {
        this.reload();
      }
    }
}