如何使用vee-validate验证所有refs

Question

我有需要验证的动态组件。

我有一个数组，我把我的组件推到那里。for循环非常有效。

validateForm() {
const PROMISES = [this.$refs.contactDetailsForm.$refs.contactDetails]
for (let i = 1; i <= this.count; i++) {
PROMISES.push(this.$refs[`passengerForm${i}`][0])
}

return Promise.all(PROMISES)
},

但问题是我不知道如何返回验证的结果。我想在另一个函数(Promise(中得到这个函数的结果。我该怎么做？

Answer 1

这就是解决方案：

validateForm() {
const PROMISES = [this.$refs.contactDetailsForm.$refs.contactDetails]
for (let i = 1; i <= this.count; i++) {
PROMISES.push(this.$refs[`passengerForm${i}`][0])
}
return new Promise((resolve, reject) => {
PROMISES.forEach(async (item) => {
const STATUS = await item.validate()
STATUS ? resolve(STATUS) : reject(STATUS)
})
})
}

Answer 2

未测试，但Promise.all返回Promise的一组结果。你需要做的是触发验证所有你想知道结果的事情，收集这些承诺，然后在Promise.all中检查结果。你没有给出足够的代码来完全回答这个问题，但它是这样的：

validateForm() {
//both of these I added validate() to because I'm hoping they are references to ValidationObservers
const PROMISES = [this.$refs.contactDetailsForm.$refs.contactDetails.validate()]
for (let i = 1; i <= this.count; i++) {
PROMISES.push(this.$refs[`passengerForm${i}`][0].validate())
}
return Promise.all(Promises);
}

然后，无论你在哪里称呼它，你都会这样做：

this.validateForm().then((values) => {
this.formIsValid = values.every((result) => result));
//if the things above are ValidationProviders rather than VO, you have to use result.valid instead of result
});