zoukankan      html  css  js  c++  java
  • Antd-for-vue 表单验证失效 自定义表单验证使表单非空验证失效



    antd-for-vue 表单验证失效 自定义表单验证使表单非空验证失效(其他验证失效)

    antd 的 表单校验方法包括 validateFields 和 validateFieldsAndScroll里面可以接收校验字段数组, options, 和一个回调函数
    • 错误代码
      organizationId: {rules: [
                   {required: true, message: '请输入团支部!'},
                   { validator: tpMemberCount ,trigger: 'change'},
                 ],
               },  //导致失效的地方  
                   //具体验证方法
            let tpMemberCount = (rule, value, callback) => {
                  console.log(value)
                  try {
                    getAction("/tp/tpOrganization/queryById", {id: value}).then((res) => {
                      if (res.success) {
                        let MemberCount = res.result.tyNumber
                        console.log(MemberCount)
                        callback();
                        if (MemberCount < 1) {
                          callback(new Error('该支部下无团员,请重新选择。'));
                        }
                      } else {
                        this.$message.warning("未查询到[" + res.result.orgName + "]组织人数,请手动填入");
                        callback();
                      }
                    });
                  } catch (err){
                    callback();
                  }
                  };
    当不设置自定义校验方法时 其他校验均有效
    • 修改子自定义的校验方法
    • 解决过程代码
    • let tpMemberCount = (rule, value, callback) => {
            console.log(1)
              getAction("/tp/tpOrganization/queryById", {id: value}).then((res) => {
                if (res.success) {
                  let MemberCount = res.result.tyNumber
                  if (MemberCount < 1) {
                    callback(new Error('该支部下无团员,请重新选择。'));
                    console.log(2)
                  }else {
                    callback()
                  }
                  // if (value == undefined && value == null && value == ''){
                  //   callback(new Error('请选择请团支部'));
                  //   console.log(3)
                  // }
                } else {
                  this.$message.warning("未查询到[" + res.result.orgName + "]组织人数,请手动填入");
                  callback();
                  console.log(4)
                }
              });
            callback()
            console.log(5)
            };

    结论在自定义的验证的方法中出现了问题

    • 修改后正确代码

      let tpMemberCount = (rule, value, callback) => {
              getAction("/tp/tpOrganization/queryById", {id: value}).then((res) => {
                if (res.success) {
                  let MemberCount = res.result.tyNumber
                  if (MemberCount < 1) {
                    callback(new Error('该支部下无团员,请重新选择。'));
                  }else {
                    callback()
                  }
                } else {
                  this.$message.warning("未查询到[" + res.result.orgName + "]组织人数,请手动填入");
                  callback();
                }
              });
            };
  • 相关阅读:
    SCRIPT7002: XMLHttpRequest: 网络错误 0x2efe, 由于出现错误 00002efe 而导致此项操作无法完成
    经纬转换成point的sql
    build.xml
    ubuntu下安装vsftpd及vsftpd配置文件不见的解决办法
    500 OOPS: could not read chroot() list file:/etc/vsftpd.chroot_list
    【linux】su、sudo、sudo su、sudo -i的用法和区别
    Js获取上一月份
    BigDecimal工具类
    查询重复的记录
    Excel 合并单元格
  • 原文地址:https://www.cnblogs.com/milankundea/p/13792197.html
Copyright © 2011-2022 走看看