美食杰---登录

登录

需要在路由表里使用beforeEach守卫拦截判断状态

1. 没有登录,需要跳转到登录页
2. 登录,直接进入
ps:判断是否需要登录,看路由里面配置有没有meta元信息 ( login为true )
在这里插入图片描述

beforeEach守卫拦截判断一下

在这里插入图片描述

登录
此时可引用饿了么开放的框架(element UI)
自行去from表单找属性复制代码

rules 验证规则
在这里插入图片描述

model 数据对象
在这里插入图片描述

validate 对整个表单进行校验的方法,参数为一个回调函数。该回调函数会在校验结束后被调用,并传入两个参数:是否校验成功和未通过校验的字段
通过点击事件提交状态
在这里插入图片描述

若code为0,则登陆成功(跳转回首页) (code为0是后端返回给咱的成功状态)

登陆成功就把数据(token)存放在本地存储中

若code为1,则登陆失败,返回服务器提示的错误信息

在这里插入图片描述

此前提需要写注册页注册账号方可登录

在这里插入图片描述

退出登录

点击退出删除本地存储中的token数据,返回首页

在这里插入图片描述

以上就是美食杰项目的登录,注册以及登出的概述,各位可自行练习

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值