vue-登录成功 保存 token ,根据 token 跳转路由
在路由跳转中我们会用到 登录成功后保存的 token
目的是为了 避免没有登录也能打开我们的项目操作页面
login.vue
this.$refs.loginForms.validate((valid) => { if (valid) { that.$post('/login',{ phone: that.loginForm.username, password: that.loginForm.password },function(ret){ that.loginLoading = false; if(ret.msg == "success"){ sessionStorage.setItem("token","success"); that.$message({type: "success", message: "登录成功"}) return that.$router.replace("/home"); }else{ that.$message({type: 'error', message: ret.msg || '请检查您的用户名和密码'}) } }) } else { that.$message({type: 'error', message: '请检查您的用户名和密码'}) this.loginLoading = false; } }) 路由(router - index.js): // 导航守卫 router.beforeEach((to, from, next) => { const token = sessionStorage.getItem('token'); const outerPaths = ['/account/login', '/account/register', '/account/forget','/auth', '/home/system/wph_set', '/home/system/pdd_set']; // 当前 path 不需要登录也可以进入系统,但是只能操作当前页面if (!token && !outerPaths.includes(to.path)) { next('/account/login'); } else { if(to.path == "/auth") { document.title = to.meta.title // 进入这个页面会被更改页面标题 } else document.title = 'CPS流量变现后台管理系统' next(); } });