javascript - Vee-Validate validateAll() with scope

Question

我有一个场景，我已经划分(范围)一个表单，以便我可以使用以下函数一次验证小块。

validateScope (scope) {
  return this.$validator.validateAll(scope);
}

我想在提交到服务器之前对整个表单进行一次最终验证；但是， validateAll() 似乎没有获取已添加到范围的输入。我也试过只验证每个范围，然后在它们全部有效时提交表单，但我不确定该怎么做，因为一切都是异步的。

validateAll () {
   let valid = true;

   // Not sure how to build this function since validateScope is asynchronous
   _.each(this.names, (name, index) => {
     if (this.validateScope(`name-${index}`)) {
       valid = false;
     }
   });

   return valid; // Always returns true even though the _.each should set it to false
}

Answer 1

正如我在评论中提到的，您的代码最终将如下所示:

validateAll () {
   let valid = true;

   let validations = []
   _.each(this.names, (name, index) => {
     validations.push(this.validateScope('name-' + index))
   });

   return Promise.all(validations)
     // consolidate the results into one Boolean
     .then(results => results.every(r => r))
}

然后，当然，您必须使用 validateAll 作为 promise :

this.validateAll().then(isValid => {
  if (!isValid) {
    //do whatever you need to do when something failed validation
  } else {
    // do whatever you need to do when everything is valid here
  }
})