export default {
data () {
return {
rules: {
NodeNameCH: [
{required: true, message: '中文名称不能为空', trigger: 'blur'},
{validator:(rule, value, cb)=>{this.isNodeNameExist(value, cb)}, trigger: 'change'}
],
nodeInsertIndex: [
{required: true, type: "number", message: '节点插入位置不能为空', trigger: 'change'},
]
}
},
methods: {
isNodeNameEnExist(value, cb, index = this.updateIndex){
for(let i=0; i<this.nodesData.length; i++){
let item = this.nodesData[i]
if(item.NodeNameEN.trim() === value.trim()){
if(!index || (index && i!==index)){
return cb(new Error('节点名称已存在'))
}
}
}
cb()
},
}
}
注意:
自定义校验的方法最后一定要执行callback函数(即cb())
否则,提交的时候校验validate方法不会执行
如果校验要依赖接口返回的结果,最好使用aysnc await的方式,
之前尝试在then里直接执行callback()方法,结果callback一直不执行
可能和validate校验也是异步执行有关
依赖接口返回值验证demo:
ruleValidate: {
bucketName: [
{
required: true,
pattern: /^[a-z0-9]+([a-z0-9-]{1,61})+[a-z0-9]$/,
message:
"Bucket名称只能包含小写字母、数字和“-”,开头结尾为小写字母和数字,且长度在3-63之间",
trigger: "change"
},
{
validator: validateBucket,
trigger: "blur"
}
],
}
const validateBucket = async (rule, value, callback) => {
if (!value) {
callback(new Error("bucket不能为空"));
} else {
let reg = /^[a-z0-9]+([a-z0-9-]{1,61})+[a-z0-9]$/;
let re = new RegExp(reg);
let res = re.test(value);
if (!res) {
callback(
new Error(
"Bucket名称只能包含小写字母、数字和“-”,开头结尾为小写字母和数字,且长度在3-63之间"
)
);
} else {
let result = await this.getBucketByName(value);
if(typeof(result)=='string'){
callback(new Error(result))
}else{
result ? callback(new Error("bucket已存在")) : callback();
}
}
}
};
getBucketByName(value) {
return new Promise((resolve, reject) => {
GetBucketByName(value).then(res => {
if (res.errno === 0) {
let isExit = false;
for (let i = 0; i < res.data.length; i++) {
let item = res.data[i];
if (item.name === value) {
isExit = true;
break
}
}
resolve(isExit);
} else {
resolve("bucket检测失败,请联系管理员");
}
});
});
}