Vue菜单重定向

644 阅读1分钟

需求点击当前菜单能重定向至当前页面(相当于其一个刷新的效果),我的做法:

1、创建重定向路由 

{
    path: '/redirect',
    component: Layout,
    hidden: true,
    children: [
      {
        path: '/redirect/:path*',
        component: () => import('@/views/redirect/index') // 文件路径自定义
      }
    ]
  },

2、创建重定向文件,在created生命周期中替换为当前路由传递的参数为新页面跳转

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

3、需要重定向刷新的页面,使用如下方法

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

4、或是菜单上,直接可以使用标签

以上则实现需求。

在nuxt中开发,也可以使用这一方式来实现菜单重定向需求。

有更好的方式,也可以大家一起探讨。