vue项目中实现刷新页面的几种方法

1、方法

最直接的刷新方式:刷新整个页面

location.reload();

this.$router.go(0)   // 0 刷新 ; -1后退 ---以此类推

这两种方式都可以直接刷新页面,缺点就是等于直接F5刷新的那种整个页面重新加载,会出现一个空白页面,

2、方法:

        新建一个空白的页面,然后在从空白的页面中使用this.$router.replace()跳回当前页面,这种方式不会造成页面出现空白期,只是在路由地址栏中会有一个快速的切换过程,整体体验还行。


3、方法:

        采用provide / inject 组合 方式,在项目的入口文件app.vue下,通过方法reload控制router-view的显示隐藏,而由于v-if会重新加载的机制,达到刷新页面的效果,

在需要当前页面刷新的页面中通过注入App.vue组件提供(provide)的 reload 依赖,然后直接用this.reload来调用就行。

你可能感兴趣的:(vue项目中实现刷新页面的几种方法)