Vue 刷新当前页面、编辑table后，刷新Table

最新推荐文章于 2025-06-12 16:41:28 发布

原创最新推荐文章于 2025-06-12 16:41:28 发布 · 1.5w 阅读

13 ·

CC 4.0 BY-SA版权

Vue 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种在Vue中实现路由刷新的方法，通过控制router-view组件的显示与隐藏，达到页面重新加载的效果。具体步骤包括在App.vue中声明reload方法，注入此方法到子组件，并在需要刷新的页面调用此方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、第一种解决方法

(1) App.vue:

声明reload方法，控制router-view 显示或者隐藏；

<template>
  <div id="app">
    <router-view v-if="isRouterAlive"></router-view>
  </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）在要刷新的Vue页面添加一下代码

页面注入reload 方法，使用时直接调用 this.reload();