网站建好更新,网站底部图标代码,wordpress加载特效,月付购物网站建站iview框架的Form 组件基于 async-validator 实现数据验证,给 Form 设置属性 rules#xff0c;同时给需要验证的 FormItem 设置属性 prop 指向对应字段即可。简单的验证北京上海深圳男女提交重置export default{data () {return{formValidate: {name:,mail:,city:,gender:,inte…iview框架的Form 组件基于 async-validator 实现数据验证,给 Form 设置属性 rules同时给需要验证的 FormItem 设置属性 prop 指向对应字段即可。简单的验证北京上海深圳男女提交重置export default{data () {return{formValidate: {name:,mail:,city:,gender:,interest: [],desc:},ruleValidate: {name: [{ required:true, message: 不能为空, trigger: blur}],mail: [{ required:true, message: 邮箱不能为空, trigger: blur},{ type:email, message: 格式错误, trigger: blur}],city: [{ required:true, message: 请选择城市, trigger: change}],gender: [{ required:true, message: 请选择性别, trigger: change}],interest: [{ required:true, type: array, min: 1, message: 请选择兴趣爱好, trigger: change},{ type:array, max: 2, message: 最多选择两项, trigger: change}]desc: [{ required:true, message: 请输入个人简介, trigger: blur},{ type:string, min: 20, message: 不能少于20个字符, trigger: blur}]}}},methods: {handleSubmit (name) {this.$refs[name].validate((valid) {if(valid) {//验证成功后执行的方法}else{//验证失败后执行的方法}})},handleReset (name) {this.$refs[name].resetFields();}}}下面是两个输入框之间关联的例子就拿最近做的一个项目举例吧,async-validator有一个字段validator可以自定义验证规则let checkc7 (rule, value, callback) {let c7 parseFloat(this.formRecord.c7)if (c7 (c6 * 0.95)) {callback(实测制冷量不应小于额定制冷量的95%)} else {callback()}}ruleRecord:{c6: [{required:true,message:不能为空}],c7: [{required:true,message:不能为空},{validator: checkc7,trigger:blur}]}
