el-form动态表单动态验证(先验证不为空，再验证长度在20以内，最后向后台发送请求验证账号是否重复)

本文主要是介绍el-form动态表单动态验证(先验证不为空，再验证长度在20以内，最后向后台发送请求验证账号是否重复)，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

data(){var checkSno = (rule, value, callback) => {if (!value) {callback(new Error("请输入账号"));} else if (value.length > 20) {callback(new Error("长度为1-20"));} else {if (this.form.id) {// 修改时检查账号是否重复selectLoginId({ sno: value, id: this.form.id }).then((res) => {if (res) {callback();} else {callback(new Error("账号重复，请选择其他账号"));}}).catch((error) => {callback(new Error("验证失败，请重试"));});} else {// 新增时检查账号是否重复selectLoginId({ sno: value }).then((res) => {if (res) {callback();} else {callback(new Error("账号重复，请选择其他账号"));}}).catch((error) => {callback(new Error("验证失败，请重试"));});}}};return{rules: {sno: [{ validator: checkSno, trigger: "blur" }],}}
}

html代码：

        <el-form-itemlabel="账号":label-width="formLabelWidth"requiredprop="sno"><el-input v-model="form.sno" autocomplete="off"></el-input></el-form-item>

这篇关于el-form动态表单动态验证(先验证不为空，再验证长度在20以内，最后向后台发送请求验证账号是否重复)的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---