vue-router判断页⾯未登录时，⾃动跳转到登录页
1.定义路由的时候配置meta属性,requireAuth⽤来标记跳转的这个路由是否需要检测登录
下⾯的两个页⾯，登录页不需要检测，⾸页需要检测
const routers = [
{
path: '/',
component: App,
    children: [
    {
    path: '/login',
    component: Login,
meta: {
title: '登录'
}
  },
  　{
    path: '/home',
    component: Home,
meta: {
title: '⾸页',
requireAuth: true
}
  }
  ]
}
]
export default routers
2.main.js
返回遍历的某个路由对象，我们定义为record，检测这个对象是否拥有meta这个对象，如果有meta这个对象，检测meta对象是不是有requireAuth这个属性且为true
检测到需要登录权限后，我的做法是请求接⼝判断⽤户是否登录
如果未登录，跳转到登录页⾯；如果已经登录，确保要调⽤next()⽅法，否则钩⼦就不会被resolved
router.beforeEach((to, from, next) => {
/* 页⾯title */
if (to.meta.title) {
document.title = to.meta.title
}
/* 判断该路由是否需要登录权限 */
if (to.matched.some(record => quireAuth)) {
//是否登录
axios.post('/home/user/isLogin')
.then(function (response) {
if (de == 0) {
//未登录
if (response.line == 0) {
next({
path: '/login',
})
} else {
//已登录
next()
}
}
})
html实现用户注册登录代码
.catch(function (error) {
// Toast(error.data.msg);
});
}
next();
})

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。