element ui 和mint ui表单验证*必填
//js控制不了时就写在行内控制 <el-form-item label="教师姓名" prop="UserId" :rules="[{ required: true, message: "班级不能为空"}]" class="el-select-class"> <el-select v-model="newClassForm.UserId" placeholder="请选择教师姓名"> <el-option v-for="item in selectTeachers" :key="item.UserId" :label="item.RealName" :value="item.UserId"> </el-option> </el-select> </el-form-item> //新建班级页面验证 newClassFormRules:{ Name: [{ required: true, message: "请输入班级名称", trigger: "blur" }], ClassType: [{ required: true, message: "请输入年级名称", trigger: "change" }], UserId: [{ required: true, message: "请输入教师姓名", trigger: "change" }] }
//更新:发现之前是错误的,没研究透彻:type:Number/String/Array/Function/Booleans ,trigger:"blur,change"; popFormRules: { Name: [{ required: true, message: "请输入机构名称", trigger: "blur,change" }, { min: 1, max: 15, message: "长度在 1到15个字", trigger: "blur" }], AllianceName: [{ required: true, message: "请选择加盟商", trigger: "change" }], Citys: [{ type: "array", required: true, message: "请选择地区", trigger: "change" }], Stock: [{ required: true, message: "请输入库存", trigger: "blur,change" }, { min: 1, max: 8, message: "长度在 1到8 个字符", trigger: "blur" }], PhoneNumber: [{ required: true, validator: updatePhone, trigger: "blur" }] } var updatePhone = (rule, value, callback) => { let editForm = this.editForm; if(!value) { return callback(new Error("手机号不能为空")); } setTimeout(() => { if(!Number(value)) { callback(new Error("请输入数字值")); } else { if(value.length !== 11) { callback(new Error("手机号是11位")); } else { this.$http .get("/rc_teahcer/checkPhoneNumber", { params: { PhoneNumber: value, Id: editForm.Id } }) .then(res => { if(res.data == true) { callback(); } else { callback(new Error("该用户已存在!")); } }); } } }, 1000); };vue+element表单验证的添加步骤
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。
- 上一篇: HTTP的长连接,你不知道的连接。。。
- 下一篇: PHP中比较两个时间的大小与日期的差值