el from表单自定义验证方法触发不了？

也还不是会员 2020-09-09 11:58:56

使用el form表单验证时，使用自定义的验证方式，如下

el.rule = { required: false, validator: funCheck, trigger: 'change' };

，只有当required值为true时才能触发funCheck方法，当required为false时触发不了，应该怎么设置才能在required值为false时也能触发自定义的funCheck方法呢？

...全文

5580 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

小意恩 2020-09-11

打赏
举报

jio可 2020-09-10

打赏
举报


  data() {
    return {
      rules: {
        // 默认设置不校验
        phone: [{
                 required: false, validator: funCheck, trigger: 'blur' 
              }]
      }
    }
  },
  watch: 
        {
         // 监听是否输入电话
          'ruleForm.phone'(val){
            if (val) {
              // 输入值以后开启校验
              this.$set(this.rules, 'phone', [{
                 required: true, validator: funCheck, trigger: 'blur' 
              }])
            } else {
              // 清空以后恢复为不校验
              this.$set(this.rules, 'phone', [{
                 required: false, validator: funCheck, trigger: 'blur' 
              }])
            }
          }
        },

jio可 2020-09-10

打赏
举报

引用 8 楼 _43554228 的回复:

[quote=引用 3 楼小小迎的回复:]你好，可以将trigger: 'change'改为trigger: 'blur'试试，还有你自定义的检验方法是什么，可以发出来看看，是不是自定义校验方法的问题

改为blur也是触发不了，底下是我的自定义方法


function funCheck(rule, value, callback) {
                var reg = /0\d{2,3}-\d{7,8}/;
                if (value) {
                    if (!reg.test(value)) {
                        return callback(new Error('请检查固定电话格式'));
                    }
                } else {
                    if (rule.required) {
                        return callback(new Error('固定电话不能为空'));
                    } 
                }
                    return callback();
            }

[/quote] 动态改变rule的required属性值，当输入值以后改变required: true，清空之后改变回false，这样就可以做到不输入不校验输入才校验。

也还不是会员 2020-09-09

打赏
举报

引用 3 楼小小迎的回复:

你好，可以将trigger: 'change'改为trigger: 'blur'试试，还有你自定义的检验方法是什么，可以发出来看看，是不是自定义校验方法的问题

改为blur也是触发不了，底下是我的自定义方法



function funCheck(rule, value, callback) {

                var reg = /0\d{2,3}-\d{7,8}/;

                if (value) {

                    if (!reg.test(value)) {

                        return callback(new Error('请检查固定电话格式'));

                    }

                } else {

                    if (rule.required) {

                        return callback(new Error('固定电话不能为空'));

                    } 

                }

                    return callback();

            }

也还不是会员 2020-09-09

打赏
举报

引用 6 楼 jio可的回复:

[quote=引用 5 楼晨易夕的回复:][quote=引用 4 楼 jio可的回复:]required的意思就是是否需要校验.........设置false还怎么校验

你确定？
不是字段必须的意思吗？[/quote]

首先字段都可以不填了还要什么检验的必要，其次如果可以不填做校验，组件会多做很多没必要的判断。required可以配置在dom上，也可以写在rule里面，dom上优先级高。不配置这个属性表单不进行校验。[/quote]required为false设置了非必填，然后此时输入了数据此时还是需要进行校验的，怎么校验啊

jio可 2020-09-09