async btnOK () {
// 1. 表单校验 (调用表单的校验方法获取校验结果)
// this.$refs.formRef.validate(function (valid) {
// console.log(valid);
// });
try {
await this.$refs.formRef.validate();
} catch (error) {
return console.log(error);
}
// 2. 数据是否要加工处理
// 3. 发生请求请求
this.isLoading = true;
// 这里异步的;如果不写awiat则会出现权限控制逻辑错误
try {
await this.$store.dispatch("user/loginAction", this.formData);
this.$router.push("/");
} catch (error) {
this.isLoading = false;
} // 调用获取用户资料的action,因为这里已经有了token
// 这里写,必须要重新登录才可以!
// await this.$store.dispatch('user/getUserProfileAction');
// 4. 跳转主页(登录成功才可以跳转)
this.isLoading = false;
},

element表单校验 【登录】的更多相关文章

  1. vue+element表单校验功能

    要实现这个功能其实并不难,element组件直接用就可以, 但是我在使用过程中碰到了几个坑,就记录下来,分享给大家,避免落坑,话不多说,直接上过程...... 表单校验功能:   实现这个功能,总共分 ...

  2. element 表单校验失败自动聚焦到失败的input框

    1.在对应的input框上添加ref属性,直接根据ref就可精确地获取到元素 <el-form-item label="课程名称" :label-width="fo ...

  3. Element 表单校验不消失问题

    由于不好的命名习惯,所以我的:rule   :ref   :model命名就是写了改,改了再写. 直到今天出现了这个毛病就是  “表单验证不消失” 比方说这里的  ‘密码不能为空’,在我已经输入了数字 ...

  4. Vue使用Element表单校验错误Cannot read property ‘validate’ of undefined

    在做注册用户的页面使用表单校验一直提示Cannot read property 'validate' of undefined错误,其实这个错误的提示根据有多种情况,比较常见的就是 ref 的名字不一 ...

  5. js--吐血总结最近遇到的变态表单校验---element+原生+jq+easyUI(前端职业生涯见过的最烦的校验)

    最近写了无数各种形式的表单,记录下奇奇怪怪的校验规则~ 一:首先是element自带的rules校验规则: element作为常用框架,自带rules属性简单易懂,官方文档一目了然,不再赘述,应付常用 ...

  6. bootstrap+jQuery.validate表单校验

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  7. jQuery.validate表单校验+bootstrap

    谈谈表单校验 这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登 ...

  8. 简单好用的表单校验插件——jQuery Validate基本使用方法总结

    jquery validate当前最新版本是1.17.0,下载链接是:https://github.com/jquery-validation/jquery-validation/releases/t ...

  9. Vue Element-ui表单校验规则,你掌握了哪些?

    1.前言   Element-ui表单校验规则,使得错误提示可以直接在form-item下面显示,无需弹出框,因此还是很好用的.   我在做了登录页面的表单校验后,一度以为我已经很了解表单的校验规则. ...

  10. 利用jquery.validate以及bootstrap的tooltip开发气泡式的表单校验组件

    表单校验是页面开发中非常常见的一类需求,相信每个前端开发人员都有这方面的经验.网上有很多成熟的表单校验框架,虽然按照它们默认的设计,用起来没有多大的问题,但是在实际工作中,表单校验有可能有比较复杂的个 ...

随机推荐

  1. 【Mybatis】target is null for method size

    问题是因为Mapper集合标签处理不够严谨导致 例如集合参数是空的情况,直接执行遍历导致此异常的出现 <if test="params.companyCodes != null and ...

  2. 【JDBC】自定义事务注解实现

    参考自: https://blog.csdn.net/qq_28986619/article/details/94451889 数据源选型,我采用的是C3P0,下面是需要的依赖: <?xml v ...

  3. 【Vue】Re07 插槽Slot

    一.插槽基本使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  4. 代码随想录Day3

    203.移除链表元素 给你一个链表的头节点 head 和一个整数 val ,请你删除链表中所有满足 Node.val == val 的节点,并返回 新的头节点 . 示例 1: 输入:head = [1 ...

  5. window系统多用户登录软件——ASTER——终端共享器——网络终端机

    Windows系统除了Server版其他的都是单用户系统,但是其实Windows系统都是内置支持多用户的,只不过除了Server版本以外的系统版本都是将多用户登录功能屏蔽掉了,如果我们可以解除掉win ...

  6. 国产计算框架mindspore在gpu环境下1.3.0版本的分布式计算组件安装 ——(openmpi 和 nccl 的安装,配置,示例代码的运行)

    前文已经给出1.3.0gpu版本的编译及安装,本文在此基础上进行分布式组件的安装,前文信息参看: 国产计算框架mindspore在gpu环境下编译分支r1.3,使用suod权限成功编译并安装,成功运行 ...

  7. 再探 游戏 《 2048 》 —— AI方法—— 缘起、缘灭(6) —— Python版本实现的《2048》游戏环境运行性能对比

    <2048>游戏在线试玩地址: https://play2048.co/ 如何解决<2048>游戏源于外网的一个讨论帖子,而这个帖子则是讨论如何解决该游戏的最早开始,可谓是&q ...

  8. Java如何防御XSS攻击?

    Q1.什么是XSS攻击? 定义很多,这里我找一个比较详细的解释 https://www.cnblogs.com/csnd/p/11807592.html Q2.为什么会有XSS攻击 也看上面的链接 Q ...

  9. Java数组小白版

    一.数组概念 一.数组定义 数组就是指在计算机内存中开辟的连续存储空间,用于存放程序运行中需要用到的一组相同类型数据的容器. 二.数组的声明 +数组的长度 定义数组时需要确定数组的长度(元素的个数), ...

  10. 我们常用的地铁卡/银行卡,竟然运行着一个 Java 虚拟机

    我们日常使用 NFC 卡可以用来刷地铁,进出门禁,但是你有没有想过, 当我们使用一个 NFC 的 IC 卡刷卡进入地铁的时候,此时系统是如何知道我这个卡上有多少充值余额的? 这个薄薄的 NFC 卡到底 ...