若依怎么去掉首页,登录后自动跳转第一个菜单

一、找到src/permission.js ,修改router.beforeEach代码

router.beforeEach((to, from, next) => {
  NProgress.start()
  if (getToken()) {
    to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
 
      if (store.getters.roles.length === 0) {
        // isRelogin.show = true
        // 判断当前用户是否已拉取完user_info信息
        store.dispatch('GetInfo').then(res => {
          // 拉取user_info
          const roles = res.roles
          store.dispatch('GenerateRoutes', { roles }).then(accessRoutes => {
            // 根据roles权限生成可访问的路由表
            // 修改默认首页
            // console.log(accessRoutes, from, to.fullPath)
            router.addRoutes(accessRoutes) // 动态添加可访问路由表
            if (to.fullPath == '/') {
              var heardPath=accessRoutes[0].path.split("/")[1]==''?"":accessRoutes[0].path;
              // 当登录之后,直接通过ip地址和端口号访问时,跳转到第一个路由页面indexPage。如:http://10.12.7.76:6090/,这样直接访问。
              let pathIndex = ''
              pathIndex = heardPath + '/' + accessRoutes[0].children[0].path
              //   console.log(accessRoutes[0].path);
              // console.log(pathIndex);
              // replace: true只是一个设置信息,告诉VUE本次操作后,不能通过浏览器后退按钮,返回前一个路由。
              next({ path: pathIndex, replace: true }) // hack方法 确保addRoutes已完成
            } else {
              // 如果是点击了一个菜单,然后刷新,保持在当前的页面。
              // 如果是从其他页面点击,通过打开新窗口跳转路由。如从当前故障报警详情里跳到实时监控页面。
              next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
              // 使用next({ ...to, replace: true })来确保addRoutes()时动态添加的路由已经被完全加载上去。
            }
            // 修改默认首页end
          })

        }).catch(err => {
            store.dispatch('LogOut').then(() => {
              Message.error(err)
              location.href = '/login';
            })
          })
      } else {
        next()
      }
  
  } else {
    // 没有token
    if (whiteList.indexOf(to.path) !== -1) {
      // 在免登录白名单,直接进入
      next()
    } else {
      next(`/login?redirect=${encodeURIComponent(to.fullPath)}`) // 否则全部重定向到登录页
      NProgress.done()
    }
  }
})

根据下图将以上代码修改即可:
在这里插入图片描述

2、src/store/modules/permission.js 修改四处代码

const permission = {
  state: {
    routes: [],
    addRoutes: [],
    defaultRoutes: [],
    topbarRouters: [],
    sidebarRouters: [],
    //修改默认页面
    indexPage:''
  },
  mutations: {
    SET_ROUTES: (state, routes) => {
      state.addRoutes = routes
      state.routes = constantRoutes.concat(routes)
    },
    SET_DEFAULT_ROUTES: (state, routes) => {
      state.defaultRoutes = constantRoutes.concat(routes)
    },
    SET_TOPBAR_ROUTES: (state, routes) => {
      state.topbarRouters = routes
    },
    SET_SIDEBAR_ROUTERS: (state, routes) => {
      state.sidebarRouters = constantRoutes.concat(routes);
    },
     SET_INDEX_PAGE:(state,indexPage)=>{
      state.indexPage = indexPage;
    }
  },
  actions: {
    // 生成路由
    GenerateRoutes({ commit }) {
      return new Promise(resolve => {
        // 向后端请求路由数据
        getRouters().then(res => {
          const sdata = JSON.parse(JSON.stringify(res.data))
          const rdata = JSON.parse(JSON.stringify(res.data))
          //修改默认首页
          const indexdata = res.data[0].path+'/'+res.data[0].children[0].path
          const sidebarRoutes = filterAsyncRouter(sdata)
          const rewriteRoutes = filterAsyncRouter(rdata, false, true)
          const asyncRoutes = filterDynamicRoutes(dynamicRoutes);
          rewriteRoutes.push({ path: '*', redirect: '/404', hidden: true })
          router.addRoutes(asyncRoutes);
          commit('SET_ROUTES', rewriteRoutes)
          commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes))
          commit('SET_DEFAULT_ROUTES', sidebarRoutes)
          commit('SET_TOPBAR_ROUTES', sidebarRoutes)
          //修改默认首页
          commit('SET_INDEX_PAGE',indexdata)
          resolve(rewriteRoutes)
        })
      })
    }
  }
}

根据下图将以上代码修改即可:
在这里插入图片描述

3、 src/router/index.js 把首页注释掉

如图:
在这里插入图片描述

4、src/utils/request.js 和 src/layout/components/Navbar.vue 修改一处代码

  store.dispatch('LogOut').then(() => {
            location.href = '/login';
          })

根据下图将以上代码修改即可:
在这里插入图片描述

在这里插入图片描述

5、login.vue修改以下代码

  // this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
             this.$store.dispatch('GetInfo').then(res => {
                // 拉取完user_info信息
                const roles = res.roles
                this.$store.dispatch('GenerateRoutes', { roles }).then(accessRoutes => {
                  // 根据roles权限生成可访问的路由表
                  // console.log(accessRoutes, from, to.fullPath)
                   var heardPath=accessRoutes[0].path.split("/")[1]==''?"":accessRoutes[0].path;
                  this.$router.addRoutes(accessRoutes) // 动态添加可访问路由表
                  let pathIndex = ''
                  pathIndex = heardPath + '/' + accessRoutes[0].children[0].path // 设置默认首页地址indexPage
                  // console.log(this.redirect, pathIndex)
                  // 1、this.redirect == undefined,主要针对直接从http://172.16.6.205:9090/login,登入系统。
                  // 2、this.redirect == '/',主要针对直接从这个http://172.16.6.205:9090/login?redirect=%2F,登入系统。因为没有设置重定向的路由
                  // 如果登录的时候出现1、2两种情况,那么就跳到路由的第一个路由页面,如果登录的时候,有设置可以访问的重定向地址,那么登录后就跳到重定向地址。
                  if (pathIndex != '') {
                    this.$router.push({ path: pathIndex  }).catch(() => {})
                    //this.$router.push({ path: this.redirect == '/' || this.redirect == undefined ? pathIndex : this.redirect }).catch(() => {}) // 跳转重定向页面或跳到默认首页indexPage
                  }
                })
              })

如图:
在这里插入图片描述
最后保存即可!!!

  • 15
    点赞
  • 33
    收藏
    觉得还不错? 一键收藏
  • 13
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 13
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值