Vue刷新当前页面
App.vue注入以下代码,以下所示:
<template>
<div id="app">
<router-view v-if="isRouterAlive"/>
<!-- Vue项目中刷新当前页面:v-if="isRouterAlive" -->
</div>
</template>
<script>
import NavMenu from '@/components/common/NavMenu'
export default {
name: 'App',
components: {NavMenu},
// Vue项目中刷新当前页面【开始】 ,以下这些是刷新页面所需的代码
provide () {
return {
reload: this.reload
}
},
data () {
return {
isRouterAlive: true
}
},
methods: {
reload () {
this.isRouterAlive = false
this.$nextTick(function () {
this.isRouterAlive = true
})
}
}
// Vue项目中刷新当前页面【结束】
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
/*margin-top: 10px;*/
}
</style>
在需要手动刷新的页面引入reload,如下所示:

inject: ['reload'], // 注入依赖 Vue项目中刷新当前页面
调用刷新reload方法:
this.reload()

浙公网安备 33010602011771号