vue.js - vue router跳转及刷新问题？

Question

需求是点退出后返回首页，碰到的问题是如果当前正好在首页点的退出，页面不会刷新，请问该如何处理？

加了随机参数也没用

function logout() {
        console.log('退出');
        localStorage.removeItem('access_token');
        localStorage.removeItem('refresh_token');
        const hash = Math.random();
        router.push({ path: '/home', query: { hash } })
            .then(() => {
                console.log('退出成功');
            }).catch(error => {
                console.log(error);
            });
    }

Answer 1

可以参考vue-element-admin的做法：

1. 添加redirect路由，该路由仅用于跳转

   <script>
   export default {
     created() {
    const { params, query } = this.$route
    const { path } = params
    this.$router.replace({ path: '/' + path, query })
     },
     render: function(h) {
    return h() // avoid warning message
     }
   }
   </script>
   

   {
    path: '/redirect',
    component: Layout,
    hidden: true,
    children: [
      {
        path: '/redirect/:path(.*)',
        component: () => import('@/views/redirect/index')
      }
    ]
     },

2. 刷新页面跳转至redirect路由即可

   this.$router.replace({
      path: '/redirect' + fullPath
   })

Answer 2

你可以讲讲为什么需要刷新吗，如果是为了接收不同的参数，可以使用路由守卫，或者简单粗暴reload刷新页面

Answer 3

navigation.reload()
重新加载页面