ant-design-vue 2.x版本 的自定义表单表单校验采坑

732 阅读1分钟

使用 vue3.0 中 antd 做自定义表单校验的时候报如下错误:

Warning: Your validator function has already return a promise. callback will be ignored.

该错误是由于新的antd的form表单校验舍弃了callback()函数,推荐使用新的promise语法; ##直接上代码了

// setup() inner
const checkDiy = (rule, value, callback) => { 
  return new Promise((resolve, reject) => {
       if (value) {
         ctx.$http
           .get(api.user.checkedRepeat, {
             dbField: rule.field,
             value,
             id: state.id ? state.id : undefined,
           })
           .then(res => {
             if (!res.data.status) {
               //   callback(`该${str}已被注册`);
               return reject(`该${str}已被注册`);
             } else {
               //   callback();
               return resolve();
             }
           })
           .catch(err => {
             // callback('手机号校验错误');
             return reject(`手机号校验错误`);
           });
       } else {
         return resolve();
       }
      });
     };
   }
   ```