Vue+elementui实现表单验证

这里希望读者去阅读一下elementui手册中关于表单组件这一部分添加链接描述
elementui中有封装好的方法去实现表单验证
1.在el-form中添加rules验证，在el-form-item中添加prop，这里一定一定要注意prop的值必须要和v-model绑定值相同，实例代码如下

2.接下来在data中添加表单验证规则

这里required是必填的意思，那么就会有人问，如果我想自定义验证规则怎么办呢？

这里笔者提供一种解决方法：
我们只需在data中定义我们需要的规则，然后再添加到表单验证即可，话不多说，上代码。
（这里只是举例说明）


最后当验证不通过阻止表单进行提交

this.$refs[formName].validate((valid)=>{
if(valid){…} //逻辑写在这里面
}）

附：
this.$refs[“ruleForm”].resetFields(); 实现表单滞空
如果表单在弹框中，放在nextTick中即可