vue中input失去焦点时验证输入的数据是否存在
做vue项目的时候遇到了一个需求,在验证某个表单项时不仅需要是必填项而且要去通过接口校验输入的数据是否存在1、给表单加:rules="rules",并且在data里面设置rulesrules: {name:[{required: true,message: '该项为必填项'},{trigger: 'blur',validator: checkValueNameIfExist}],}2、定义chec
·
做vue项目的时候遇到了一个需求,在验证某个表单项时不仅需要是必填项而且要去通过接口校验输入的数据是否存在
1、给表单加:rules="rules",并且在data里面设置rules
rules: {
name:[{required: true,message: '该项为必填项'},
{trigger: 'blur',validator: checkValueNameIfExist}
],
}
2、定义checkValueNameIfExist,并调用验证方法。
data() {
var checkValueNameIfExist = (rule, value, callback) => {
if (value) {
this.validateHas(value);//验证方法
}
callback();
};
return {}
}
methods:{
validateHas(value) {
//从后台接口获取数据,把name传过去,如果res不为空则存在
let param = {
name:value,
};
this.$api.getDetailByName(param).then((data) => {
let res = data.data.data
res = JSON.parse(JSON.stringify(res));
if (res == null) {
this.$message.error('名称不存在')
}
})
},
}
更多推荐
已为社区贡献6条内容
所有评论(0)