bootstrapValidator的callback方法使用(自定义验证规则)

使用bootstrapValidator的callback方法,可以从回调函数返回验证结果,它可以用来自定义表单验证的规则。

参数:callback:function(value,validator,$field){

			 // value 当前字段的值

			 // validator 整个bootstrapValidator验证器 

		     // $field 当前的字段的jQuery对象
			 
} 

举例:

        callback: {
            message: '该值不能为0',
            callback: function(value, validator) {  //这里可以自定义value的判断规则
                if (value == 0) {
                    return false;
                } else {
                    return true;
                }
            }
        }

多个判断,返回不同的验证结果:

        callback: {
            callback: function(value, validator) {  //这里可以自定义value的判断规则
            	var bool = Valider(value);
                if (bool == 1) {
                    return {valid: false, message: '该值不能为1'};
                } else if (bool == 2) {
                    return {valid: false, message: '该值不能为2'};
                } else {
                	return true;
                }
            }
        }
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
在 Element UI 中,可以通过自定义验证规则验证表单输入的数据。面是一个示例代码,演示何自定义验证规则: ```javascript // 导入 Element UI 的验证规则方法 import { validate } from 'element-ui' // 自定义验证规则 const customRules = { // 自定义规则名称:验证函数 customRule1: (rule, value, callback) => { if (value === 'custom') { callback(new Error('自定义规则1验证失败')) } else { callback() } }, customRule2: (rule, value, callback) => { if (value.length < 5) { callback(new Error('自定义规则2验证失败')) } else { callback() } }, } // 在表单中使用自定义验证规则 <el-form :rules="customRules"> <el-form-item label="自定义规则1"> <el-input v-model="input1"></el-input> </el-form-item> <el-form-item label="自定义规则2"> <el-input v-model="input2"></el-input> </el-form-item> </el-form> ``` 在上面的代码中,我们首先导入了 Element UI 的验证规则方法 `validate`。然后定义了两个自定义验证规则 `customRule1` 和 `customRule2`,这两个规则分别对输入的值进行验证,并根据验证结果调用回调函数 `callback`。当验证失败时,使用 `new Error()` 创建一个错误对象,并传递给回调函数;当验证通过时,直接调用回调函数即可。 最后,在表单中使用自定义验证规则时,将自定义规则对象 `customRules` 通过 `:rules` 属性传递给 `el-form` 组件。在每个需要验证的表单项中,通过 `v-model` 绑定输入的值,然后在 `el-form-item` 组件中添加相应的标签和验证提示信息。 这样,当用户输入的值不符合自定义验证规则时,Element UI 会自动显示相应的错误提示信息。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值