H5W3
当前位置:H5W3 > 其他技术问题 > 正文

vue.js+element-ui,如何主动trigger某个rules进行验证?

在表单中有两个控件,使用了rules和prop的方式进行合法性验证:
el-select
el-input
el-select的选择会导致el-input中的合法取值范围变化,当el-input中已经被输入了合法数字,用户又去修改el-select中的选项时,如何触发el-input重新检测合法性,提示非法输入?

    sysdiskSize: [
      { required: true, message: '请输入系统盘大小', trigger: 'blur', type: "number" },
      { validator: validateSysDiskSize, trigger: 'blur' }
    ],

回答:

使用validateField方法,比如要检验prop为‘aaa’的属性,form的ref为‘fromName’,如下使用:
this.refs.formName.validateField(‘aaa’);

回答:

文档中有这样一个属性,validate-on-rule-change应该可以满足你的需求,描述是

是否在 rules 属性改变后立即触发一次验证

回答:

你上的这段代码是校验el-input的?如果是,把trigger: 'blur'改成trigger: 'blur, change',上下都要改

回答:

可以把两个组件包裹在一个 form 里,给 el-select 绑定 change 监听,当下拉选择变化的时候,通过事件 出发 form 的validate 方法,进而触发 input 的校验

本文地址:H5W3 » vue.js+element-ui,如何主动trigger某个rules进行验证?

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址