发表于: 2020-03-14 21:51:54
1 1575
今天完成的事情:
1.推进任务
明天计划的事情:
1.推进任务
遇到的问题和收获:
使用路由导航守卫来进行是否登录的判断
index.js中
path: '/home',
component: ArticleMain,
redirect: '/home/welcome',
meta: {
LoginPage: true
},//配置meta,进入页面前判断是否需要登录
main.js中
//验证是否登录,未登录则跳转到登录页面
router.beforeEach((to, from, next) => {
if (to.matched.some(res => res.meta.LoginPage)) { // 验证是否需要登陆
if (sessionStorage.getItem('sid')) {// 查询本地存储信息是否已经登陆,sid在LoginPage组件
next()
} else {
next({
path: '/login',//未登录则跳转到login页面
query: {redirect: 'to.fullPath'}//登录成功返回当前页面,这里传值给login。to.fullPath为当前点击的页面
})
}
}
})
登录组件中,登录成功会进行保存名字
if (res.data.code === 0) {
this.$message.success('登录成功!');
sessionStorage.setItem('sid', res.data.data.manager.name)
this.$router.push(this.$route.query.redirect)//跳转至前一页,this.$route.query.redirect是获取上面传来的值
this.$router.push({
path: '/home'
})
不过还是有点问题。并没有实现想要的功能,且没完全看懂代码。继续优化下
评论