2021-03-25

用户登录操作

登录操作触发条件

当用户点击登录按钮出发单机事件,执行对应的事件回调处理函数submit
在这里插入图片描述

在这里插入图片描述此时即可验证用户是否登陆成功

登录失败:

在这里插入图片描述
当获取到对应的错误提示信息与错误提示码,我们可以向用户提示错误信息

在这里插入图片描述
报错效果展示:

在这里插入图片描述
注意:此种方式会导致报错固化,所以我们需要编写代码如下

登录成功

在这里插入图片描述
验证实现方式,通过表单双向绑定获取用户登陆输入的表单数据,这样我们post提交的数据即可获取到data选项中的数据form
在这里插入图片描述
登录成功后我们需要执行如下操作

1-存储到vuex
2-存储到本地存储
3-成功提示
4-跳转到后台首页

/*
1.存储到vuex
* store目录 -- modules目录 -- 新建【user.js(作为用户信息的存储)】
* 在index.js中引入user.js
* 设置user.js基础结构
* 注意:当用户登陆成功后,我们需要将登录的用户的数据存储起来
2.存储到本地存储

在这里插入图片描述
此处是调用方法的作用

在这里插入图片描述
此处就是登录的一些代码

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值