页面无感刷新

一. 无感刷新

"""------------------------APP.Vue------------------------"""

<template>
  <div id="app">

    # 1. v-if="isRouterAlive"
    <router-view v-if="isRouterAlive"/>
  </div>
</template>
<script>
export default {
  data() {
    return {
      # 2. isRouterAlive: true
      isRouterAlive: true
    }
  },
  # 3. provide 和 methods 所有内容
  provide() {
    return {
      reload:this.reload
    }
  },
  methods: {
    reload() {
      this.isRouterAlive = false
      this.$nextTick(() => {
        this.isRouterAlive = true
      })
    }
  }
}


</script>

"""------------------------需要刷新的.Vue------------------------"""

export default {
    # 1. 注册
    inject:['reload'],

    data() {
        return {
        }
    },
    methods:{
        myfunc(){
            # eg: 在这里使用
            this.reload()
        }
    }
}


# 2. 在需要刷新的地方使用
this.reload()

posted @ 2024-04-13 23:19  code455  阅读(2)  评论(0编辑  收藏  举报