在vue项目中,我们可能会遇到这种需求,就是需要刷新页面。如果直接刷新页面的话,就会出现白屏的情况,如果刷新路由就不会出现这种情况。
如果直接push当前地址的话,这显然不行。
最好的办法就是弄一个页面用来跳转,需要刷新的页面跳转到那个页面,那个页面利用导航守卫直接跳回来源路由。这个估计会有点不理解,我们来看代码吧。
需要操作刷新的页面:
var query = this.$route.query; //如果有参数就把参数带过去
query.t = Date.now(); //时间戳,这个随意什么都行
if (typeof obj != "string") {
//刷新页面
this.$router.replace({
path: "/routers", //跳转到这个页面
query: query
});
} else {
//指定跳转
this.$router.replace({
path: obj,
query: query
});
}
routers.vue:
beforeRouteEnter(to, from, next) {
next(vm => {
vm.$router.replace({
path: from.path,
query: from.query
});
});
}
//跳回来源路由,这样就可以直接刷新路由,这样的刷新就不会出现白屏了。