FCAT同时校验多个表单
element的表单的校验是一个异步过程，如果需要同时校验，则需要配合promise的all方法。
html
<script>
export default {
methods: {
async confirm(row) {
const validates = await Promise.all([
this.promiseValidate("name_ref" + row.contral.index),
this.promiseValidate("startDate_ref" + row.contral.index),
this.promiseValidate("duration_ref" + row.contral.index),
this.promiseValidate("each_issue_ref" + row.contral.index)
])
if (validates.every(item => item)) {
row.contral.change = false
}
},
promiseValidate(key) {
return new Promise((resolve, reject) => {
try {
this.$refs[key].validate(isValid => {
resolve(isValid)
})
} catch (err) {
reject(err)
}
})
},
}
}
</script><script>
export default {
methods: {
async confirm(row) {
const validates = await Promise.all([
this.promiseValidate("name_ref" + row.contral.index),
this.promiseValidate("startDate_ref" + row.contral.index),
this.promiseValidate("duration_ref" + row.contral.index),
this.promiseValidate("each_issue_ref" + row.contral.index)
])
if (validates.every(item => item)) {
row.contral.change = false
}
},
promiseValidate(key) {
return new Promise((resolve, reject) => {
try {
this.$refs[key].validate(isValid => {
resolve(isValid)
})
} catch (err) {
reject(err)
}
})
},
}
}
</script>校验v-for生成的表单
element的表单通过vue2提供的 v-for 之后，获得的ref会变成一个数组，这时仅需在指定代码位置添加一个[0]即可正常获得dom元素。
html
<script>
export default {
methods: {
test() {
this.$refs[key][0].validate(isValid => {
resolve(isValid)
})
}
}
}
</script><script>
export default {
methods: {
test() {
this.$refs[key][0].validate(isValid => {
resolve(isValid)
})
}
}
}
</script>