1、行内简单
<el-form-item
label="paramValue:"
prop="paramValue"
:rules="[
{ required: true, message: 'paramValue不能为空'},
{ type: 'number', message: 'paramValue必须为数字值'}
]"
>
提交调用验证
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
} else {
console.log("error submit!!");
return false;
}
});
},
2、组件封装配置项
1 data里面
data() {
var validateNumber=(rule, value, callback) => {
if (value < 0) {
callback(new Error("请输入正数!"));
} else {
callback();
}
};
return {}
}
formSettings: [
{
items: [
{
label: "app名字",
name: "appName",
type: "text",
valueType: "string",
disabled: false,
required: true,
placeholder: "请输入app名字",
rule: [
{
required: true,
validator:validateNumber,
trigger: "blur"
}
]
},]
}]
2 methods 里面
methods:{
validatePass(rule, value, callback) {
let data = {
tenantId: this.currentUser,
name: value
};
//发送请求
return new Promise((resolve, reject) => {
checkName(data)
.then(response => {
if (response.data.result == true) {
callback();
} else {
callback(new Error("名称重复,请重新输入"));
}
resolve();
})
.catch(reject => {
console.log(reject);
});
});
}
}
//设置
formSettings: [
{
items: [
{
label: "app名字",
name: "appName",
type: "text",
valueType: "string",
disabled: false,
required: true,
placeholder: "请输入app名字",
rule: [
{
required: true,
validator:this.validatePass,
trigger: "blur"
}
]
},]
}]
网友评论