form表单验证问题,valid打印不出来,然后报错?

form表单验证问题,valid打印不出来

saveDraft(nextFlag) {

  const datas = clone(this.formValidate);
  datas.omitFlag = datas.omitFlag ? 1 : 0;
  datas.irsName =
    datas.projSysList.map((item) => item.name).join(";") || "";
  datas.irsCode =
    datas.projSysList.map((item) => item.code).join(";") || "";

  const params = {
    ...datas,
    id: this.projectId,
    financialSource:
      datas.financialSource === "其他"
        ? this.ruleValidate.financialSource.value
        : datas.financialSource,
    projectCompanyCode:
      this.OrganizationListByName.find(
        (e) => e.organizationName === datas.projectCompany
      )?.organizationCode || "",
    coordinateCompany: datas.coordinateCompanyList
      .map((item) => item.value)
      .join("|"),
    historyProjectName: datas.historyProjectList
      ?.map((item) => item.value)
      .join("|"),
    projectProperty: datas.projectPropertyList.join("|"),
    buildType: datas.buildTypeList.join("|"),
  };
  if (nextFlag) {
    // 返回一个新的 Promise、
    return new Promise((resolve, reject) => {
      
      this.$refs.formValidate.validateField('budgetYear', (valid) => {
        console.log("测试验证结果:", valid);
        if (valid) {
          this.saveFlag = true;
          this.submitloading = true;
          saveProjectInfo(params)
            .then((res) => {
              resolve(res.data);
            })
            .catch((err) => {
              reject(err);
            })
            .finally(() => {
              this.submitloading = false;
            });
        } else {
          // 校验失败时也 resolve 或 reject,根据您的业务逻辑
          reject(new Error("表单校验未通过"));
          // 或者如果您想将校验失败视为正常流程:
          // resolve({ status: "validation_failed" });
        }
      });
    });
  } else {
    // 非 nextFlag 情况保持不变
    this.submitloading = true;
    return new Promise((resolve, reject) => {
      saveProjectInfo(params)
        .then((res) => {
          resolve(res.data);
        })
        .catch((err) => {
          reject(err);
        })
        .finally(() => {
          this.submitloading = false;
        });
    });
  }
},valid的没有值,然后会一直说校验未通过,改成数组就Uncaught (in promise) Error: [iView warn]: must call validateField with valid prop string!不知道该怎么解决了
阅读 914
3 个回答

validate是校验整个表单吧,不支持传入字段名的
如果只校验budgetYear字段,应该有个 validateField 方法吧

this.$refs.formValidate.validateField('budgetYear', (valid) => {
  console.log(valid); // true / false
});

你的问题在于 validate 方法的用法错误:

  • 正确的 API 应该是:

    • this.$refs.formValidate.validate(callback) - 验证整个表单
    • this.$refs.formValidate.validateField('budgetYear', callback) - 验证单个字段

解决方案

验证整个表单(推荐)

saveDraft(nextFlag) {
  // ... 你的数据处理逻辑 ...

  if (nextFlag) {
    return new Promise((resolve, reject) => {
      // 验证整个表单
      this.$refs.formValidate.validate((valid) => {
        console.log("测试验证结果:", valid);
        if (valid) {
          this.saveFlag = true;
          this.submitloading = true;
          saveProjectInfo(params)
            .then((res) => {
              resolve(res.data);
            })
            .catch((err) => {
              reject(err);
            })
            .finally(() => {
              this.submitloading = false;
            });
        } else {
          reject(new Error("表单校验未通过"));
        }
      });
    });
  } else {
    // ... 非 nextFlag 的逻辑 ...
  }
}
新手上路,请多包涵

已经解决了:
1.有v-if判断,需要先判断是否存在字段。
2.必须是字符串,不能是数组,例如:["name","age"]。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题