vue 问题集锦(一)

159 阅读1分钟

有这样的一个需求,当我想刷新当前路由,怎样办?

1 整个页面强刷新

方法一
location. reload()

方法二
this.$router.go(0)

以上方法会强制刷新整个浏览器页面,使得页面出现短暂的空白,十分影响体验

2 跳转刷新页面的方法

利用一个空的中转页面,再跳回原页面,使得不会出现路由重复的报错问题。

1 新建一个refresh.vue文件

<template>
  <div></div>
</template>
<script>
export default {
  beforeRouteEnter(to, from, next) {
    next(vm => {
      vm.$router.replace(from.path); //注意必须是replace,使得浏览器不会记录这个路由信息
    });
  },
};
</script>

2 增加refresh的路由‘/refresh’

3 在跳转方法内重新定义跳转逻辑
if(newPath === oldPath){
    this.$router.replace({ path: '/refresh' })
}