本篇幅讲解的是,招聘管理系统-前端路由和登录拦截器
求职者端使用uniapp开发,且不登录也可以查看职位,不涉及路由和登录拦截器
B端管理端使用vue2.0+ts开发,关于路由配置可以查看这篇文章,讲的很详细 vue2.x搭建saas项目系列之三:router配置相关
B端管理端-登录拦截相关逻辑如下
核心就是使用路由的钩子函数
permission.ts
import router from './router'
import { Route } from 'vue-router'
import { UserModule } from '@/store/modules/user'
import settings from './settings'
const whiteList = ['/login']
const getPageTitle = (key: string) => {
return `${settings.title}`
}
router.beforeEach(async(to: Route, _: Route, next: any) => {
if (UserModule.token) {
if (to.path === '/' || to.path === '/login') {
next({ path: '/recruitMg/candidate/index' })
} else {
next()
}
} else {
if (whiteList.indexOf(to.path) !== -1) {
next()
} else {
next(`/login?redirect=${to.path}`)
}
}
})
router.afterEach((to: Route) => {
document.title = getPageTitle(to.meta.title)
})
main.ts
import '@/permission'
未完待续