Vue页面重载

通过v-if的功能触发页面刷新，结合provide和inject

1. 修改主文件App.vue

原文件如下

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

<script>
export default {
  name: 'App'
}
</script>

<style lang="less">
@import "./assets/css/app.css";
@import "./assets/css/time-range.css";
</style>

修改后的文件如下

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

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

      })
    }
  }
}
</script>

<style lang="less">
@import "./assets/css/app.css";
@import "./assets/css/time-range.css";
</style>

2. 在需要用到的主文件导入

export default {
  name: "demo",
  inject:['reload'],
  data() {
    return {
      
    }
  },
  methods: {
    reflesh(){
      this.reload()
    },
  }
}