小记 Vue $nextTick .then()

需求是有流程节点若干个，可以上一步下一步进行节点的切换且并不会校验字段 假设目前一共4个节点 在第三个节点点击保存时 需要校验 1 2 3 3个节点 的form是否填写 validate中开头先存入当前点击的节点然后调用方法从0开始校验 如果节点不等于最终节点则一直校验并返回promise状态失败的话页面会有提示 成功则在进入next校验下个节点

点击保存时触发节点校验返回的promise是成功的才会新增或者修改保存成功 否则不会进入.then()

//保存时依次校验节点
nextCheck(active) {
  this.active = active;
  if (active === this.submitActive) {
    return this.$nextTick().then(()=>{
      return this.$refs['processForm'].validate()
    })
  }else{
    return this.$nextTick().then(()=>{
      return this.$refs['processForm'].validate()
    }).then(()=>{
      return this.nextCheck(active+1);
    })
  }
},
//当前表单校验
validate() {
  this.submitActive = this.active;
  // return this.$refs['processForm'].validate()
  return this.nextCheck(0);
},