vue admin element 脚手架关于登陆后的跳转

Question

export const constantRoutes = [  
  {
    path: '/',
    component: Layout,
    redirect: '/home',
    children: [
      {
        path: 'home',
        component: () => import('@/views/home/index'),
        name: 'HomePage',
        hidden: true,
        meta: { title: '主页', icon: 'dashboard', affix: false }
      }
    ]
  }
]

export const asyncRoutes = [
  // 项目的路由开始
  {
    path: '/company',
    component: Layout,
    redirect: '/company/index',
    name: 'Company',
    hidden: true,
    meta: {
      title: '入驻页',
      icon: 'guide',
      roles: ['editor']
    },
    alwaysShow: false,
    children: []
  },
  {
    path: '/government',
    component: Layout,
    redirect: '/government/distribution',
    name: 'GovernmentModule',
    meta: {
      title: '政务服务中心',
      icon: 'guide',
      roles: ['admin']
    },
    hidden: false,
    alwaysShow: false,
    children: []
}]

在/home中根据登陆用户的角色跳转到不同的页面. 但有个问题是/home都显示在tagview中。如何让它不显示,以防止操作者去点击

<template>
  <div class="dashboard-container">
    正在跳转
  </div>
</template>
<script>
import { mapGetters } from 'vuex'

export default {
  name: 'HomePage',
  computed: {
    ...mapGetters([
      'roles',
      'editorMode'
    ])
  },
  created() {
    // 调用全局挂载的方法，关闭当前页
    this.$store.dispatch('tagsView/delView', this.$route)
    if (this.editorMode) {
      // 跳转到申请
      this.$router.push('/company/index');
    } else {
      // 路转到管理后台
      this.$router.push('/government/distribution');
    }
  }
}
</script>

Answer 1

/home这样配置都可以了

  {
    path: '/home',
    component: () => import('@/views/home/index'),
    hidden: true
  }

跳转的代码

      // 调用全局挂载的方法，关闭当前页
      this.$store.dispatch('tagsView/delView', this.$route).then(({ visitedViews }) => {
        // this.$router.push(mp)
        this.$router.replace({path: mp });
      }).catch(err => {
        alert(err)
      })