elementUI From表单校验，整体校验和部分校验的使用方法 _表单

我们在开发中，有势会接到一种关于表单验证的需求，在对整体表单验证的同时也希望对单个表单进行验证，虽然官网都有api，但是为了让大家更为直观，这里小杰为了更为直观的理解做了总结。
本次涉及到的核心点
（）参数为回调函数
（arr,）第一个参数为数组，第二个参数为回调函数
--额外两个--
（）表单重置，表单所有字段值重置为初始值，移除校验结果
（arr/）移除表单项的校验结果。他的参数是字符串或者数组，想移除那个就把prop值作为参数，多个就以数组形式
---------------------------------接下来我们进入正题----------------------------------
from表单
------表单随便写的不要在意格式，此次的目的是为了理解表单校验-----
校验取消提交
一. 首先是创建校验规则
1. 表单验证
//trigger: "blur" 输入框失焦时触发校验//required: true 输入框为空校验提示rules: {user: [{ required: true, message: '请输入账户', trigger: "blur" }],pass: [{required: true, message: '请输入密码' ,trigger: "blur" },],},
2. 自定义校验规则
var validateuser = (rule, value, callback) => {if (value =http://www.kingceram.com/post/=="") {callback(new Error("账户为空"));} else if (!/^\d{4}$/.test(value)){callback(new Error("请输入正确的账户"));}callback();};var validatePass = (rule, value, callback) => {if (value =http://www.kingceram.com/post/=="") {callback(new Error("密码为空"));} elseif (!/\d/.test(value)) {callback(new Error("请输入正确密码"));}callback();};return {ruleFrom:{user: "",pass: "",},rules: {user: [{ validator: validateuser,trigger: "blur" }],pass: [{ validator: validatePass,trigger: "blur" },],},
注：这些操作都是在data()下进行的
二、校验
1. 点击提交时，整体表单校验，方法
//value 返回的是布尔值 true和falsesubmitForm() {this.$refs.ruleForm.validate((value) => {console.log(value)});},
--------------校验效果如图所示-------------
①、表单为空时
②、表单不符合规则
③、表单部分不符合规则
④、表单校验成功
2. 点击校验时，对部分表单校验，方法，这里拿账户来举例
//validateField第一个参数是数组，里面就是我们要部分校验的表单//validateField第二个参数是数组，valid返回的是表单验证错误时返回的提示语，vv返回的是个对象dd() {this.$refs.ruleForm.validateField(["user"], (valid,vv) => {if(!valid){console.log("校验成功")}});},
----------校验效果如图所示------------
①、账户为空时
②、账户不符合规则
③、账户验证成功 valid返回的是空串，vv返回的是null
【elementUI From表单校验，整体校验和部分校验的使用方法】最后，如果想在添加提交的时候也校验一下部分表单是否通过，可以加个开关然后在中多加一个开关判断就ok了，希望可以帮助到大家