vue 多表单验证

最新推荐文章于 2025-08-11 14:45:02 发布

原创最新推荐文章于 2025-08-11 14:45:02 发布 · 120 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

/** 提交按钮 */
function submitForm() {
  const basicForm = proxy.$refs.basicInfo.$refs.basicInfoForm;
  const genForm = proxy.$refs.genInfo.$refs.genInfoForm;

  console.log(info.value);
  console.log(columns.value);

  Promise.all([basicForm,genForm ].map(getFormPromise)).then((res) => {
    // const validateResult = res.every((item) => !!item);
    const isAllValid = res.every((isValid) => isValid);
    if (isAllValid) {
      const genTable = Object.assign({}, info.value);
      genTable.columns = columns.value;
      addbasic(genTable).then((res) => {
        proxy.$modal.msgSuccess(res.msg);
        if (res.code === 200) {
          close();
        }
      });
    } else {
      proxy.$modal.msgError("表单校验未通过，请重新检查提交内容");
    }
  });
}

function getFormPromise(form) {
  return new Promise((resolve) => {
    form.validate((res) => {
      resolve(res);
    });
  });
}