カスタムページフォームが検証をトリガーします

https://docs.aliwork.com/docs/yida_support/ui648w/ynk2lo

1. 使用シーン

注意: 検証は、コンポーネントのステータスが通常の場合にのみトリガーされます。

この例では、カスタムページフォームでカスタム検証をトリガーする方法を紹介します。

2. 機能を実現する

2.1. カスタムページの作成

2.2. 次のコードをページにコピーします

Fieldlistパラメータの変更に注意してください。

export function onClick() {
  // 需要校验组件的唯一标识集合
  const fieldList = [
    'textField_lbae89dt',
    'numberField_lbae9dsh',
    'radioField_lbae9dsj',
    'employeeField_lbae9dsk',
    'imageField_lbae9dsl',
    'rateField_lbae9dsm',
    'tableField_lc8hi5ij',
    'tableField_lc8ia6jp',
    'tableField_lc8ia6jr',
    'tableField_lc8ia6jt',
    'tableField_lc8ia6jv'
  ];

  // 调用表单校验函数 
  this.fieldsValidate(fieldList).then((errorList) => {
    setTimeout(() => {
      if (errorList.length > 0) {
        // 表单校验未通过，可做一些数据错误提示
        console.log(errorList);
        return;
      };

      // 表单校验通过，你的后续业务逻辑由此往下写
      this.utils.toast({
        title: '表单校验通过',
        type: 'success',
      });
    });
  }, 0);
}

/**
* 组件校验
* 仅校验组件状态为普通的组件
* @param {array} fieldList 需要校验组件的唯一标识数组
*/
export async function fieldsValidate(fieldList = []) {
  const result = [];
  for (let i = 0; i < fieldList.length; i++) {
    if (this.$(fieldList[i]).getBehavior() === 'NORMAL') {
      await this.$(fieldList[i]).validate((errors, values) => {
        if (!errors) { return };
        result.push({
          fieldId: fieldList[i], // 组件标识
          errors: this.utils.isMobile() ? errors.errors[fieldList[i]].errors : errors[fieldList[i]].errors, // 校验错误信息
        });
      });
    }
  };
  return result;
}