最近在项目中遇到一个场景,就是在校验输入框失焦(blur)事件后,第一次点击时按钮的点击事件失效,后来排查,发现原因,是因为第一次点击时先走了blur事件,然后再走点击事件,所以导致第一次点击按钮失效。 出现bug的原因 由于浏览器的默认事件,当你点击按钮时,页面中有文本框失焦时,会先触发文本框的blur事件,然后再...
1. blur:在表单项失去焦点时触发校验。 2. change:在表单项值发生改变时触发校验。 3. submit:在表单提交时触发校验。 可以通过设置el-form的validate-trigger属性来指定校验触发时机,默认为blur。 四、校验结果处理 el-form提供了多种方法来处理校验结果,以便在界面上显示错误提示信息。常用的方法有: 1. validate...
trigger: ['blur', 'change'] } trigger类型为blur的功能是文本框失去焦点才会触发 trigger类型为change的功能是文本框在输入内容时触发 trigger类型也可以同时使用blur和change,功能结合上面两个的功能
在使用form组件自带的事件时,无法触发,这时候我想到自定义blur事件来验证是否选中,但是无法正常获取到双向绑定的值 最后打印form数据时却能正常打印,搜寻到一个方法,在blur事件里面使用定时器来触发,待定,等我试一下再来填坑。
pass: [{ required: true, message: '请输入名字', trigger: 'blur' }], age: [{ required: true, message: '请输入年龄', trigger: 'blur' }], }, } }, methods: { submitForm(formName) { this.$refs[formName].validate(valid => { ...
[ { required: true, // 是否必填 是 trigger: '', // blur 或 change 这里就不指定触发方式了,保存提交时再校验 itemType: 'selectOne', // 当前类型,固定下拉框类型 labelName: item.labelName, // 当前输入框的名字 value: form[item.propName], // 输入框输入的绑定的值 validator: validateEvery...
required: true, message: '请选择参与人员', trigger: 'blur', }"><el-selectv-model="items.name"filterablesize="small"placeholder="请选择参与人员"multiple@change="changeuser(items)"style="width: 470px;"><el-optionv-for="(item,index) in items.userList":key="index":label="item.userName"...
@blur="blurEvent(item.event)" :show-password="item.showPassword" :style="item.style" /> <!-- 文本输入框 --> <el-input v-if="item.type === 'textarea'" v-model.trim="data[item.value]" :type="item.type" :disabled="item.disabled" ...
{ required: true, trigger: 'blur', message: '请输入名称' } ]} data() { var existPhoneRule = (rule, value, callback) => { // 手机号唯一性校验 let regx = /^1[0-9]{10}$/;if (!value) { return callback(new Error('请输入手机号'));} if (!regx.test(...
<el-inputv-model.number="ruleForm_lottery.lotteryNumber"onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))"@blur="blurFunc_lottery('lotteryNumber')"maxlength="3"placeholder="请输入开奖人数"></el-input> 1. 2. 3. ...