Vxe-Table表单文本框验证是否存在

        近期项目中使用了vxe-table的表单组件(vxe-form),在进行表单验证时,需要对其中一个字段进行验证,判断该字段是否在数据库中存在,如果存在界面显示异常信息:

        此处功能用到了javascript的防抖功能,但是未出现预期的效果

export const debounce = (fn, delay) => {
  var timer = null;
  var delay = delay || 200;
  return function () {
    var args = arguments;
    var that = this;
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(that, args);
    }, delay);
  };
};

表单验证:

{
    required: true,
    validator: debounce(({ itemValue }) => {
        return new Promise((resolve, reject) => {
          getCode(itemValue).then((res) => {
              if (res.data) reject(new Error("代码已存在"));
          });
        });
    }, 1000),
}

上述代码并没有在界面上显示异常信息.

使用下列代码成功实现效果:

{
    required: true,
    validator: ({ itemValue }) => {
        return new Promise((resolve, reject) => {
        clearTimeout(this.timer);
        this.timer = setTimeout(() => {
            getCode(itemValue).then((res)=>{
                if(res.data)reject(new Error('Code已存在'));
            })
            }, 1000);
        });
    },
},

vxe-form表单验证需要接受一个Promise<new Error>或者new Error的返回参数

标记