跳到主要内容

校验

低代码表单设计器为每一个表单组件提供了高度自定义的校验功能，帮助开发者完整的实现表单的校验逻辑。

必填校验​

必填校验是最基本的校验方式，当某一项表单字段设定为必填，用户未填写时将无法提交表单。通过此功能，开发者可以明确指定需要用户必须填写的字段。

校验触发时机​

低代码表单设计器提供了灵活的校验触发时机，包括：

  • 默认提交触发：当用户点击提交按钮时，进行全部表单项的校验。
  • 值变化时触发：当用户修改了某一表单项的值时，立即对该项进行校验。
  • 失去焦点时触发：当用户编辑完某一项表单，焦点离开时，进行该项的校验。

这种灵活的触发方式保证了校验的及时性和有效性。

自定义校验函数​

除了内置的校验方式，低代码表单设计器还支持自定义校验函数。开发者可以根据实际业务需求，编写自定义校验函数，实现更复杂的校验逻辑。

示例​

  • 主动触发：
module.exports = function (params, ctx) {
  const value = params.value;
  return new Promise((resolve, reject) => {
    if (value === "小明") {
      resolve(true);
    } else {
      reject("请重新输入");
    }
  });
};

此时，当 value 的值为“小明”时，校验通过，否则校验不通过，提示“请重新输入”。 当然这个校验也受到校验触发时机的影响，如果是失去焦点时触发，那么只有当用户输入完“小明”后，才会进行校验。具体的可以参考校验触发时机。

  • 事件触发
const [isValid, errors] = await ctx.validate("input_8zank9wkw76qu");
ctx.setInstance("input_8zank9wkw76qu", "validateMode", "change");
console.log("error log,,,,,,,", isValid, errors);

当然，你也可以通过事件触发校验，这里的input_8zank9wkw76qu是表单项的id，validateMode是校验的触发时机，change是触发时机的值，这样更加的灵活。

校验模版​

我们提供了校验模版，可以直接使用，也可以根据自己的需求进行修改。

自定义组件

提示

校验函数的返回值为Promise，是个异步函数 ，当校验通过时，resolve(true)，否则reject("错误信息")。