表单校验未通过时让光标移动到第一个校验未通过的input
vue2.0 + ElementUI 2.13.2
// html
<el-form class="form_one" ref="formOne" :rules="formOneRuls">
// 省略 表单内容部分
<el-form/>
// javascript
export default {
data(){
formOneRuls:{
XX : [{required:true, message:'XX不能为空',trigger:'blur'}]
}
},
methods:{
submit(){
// 表单提交
this.$refs.formOne.validate( valid=>{
if(valid){
// 提交
}else{
// 校验不通过移动光标到第一个未通过的input
setTimeout( ()=>{
let error = document.getElementsByClassName('is-error');
error[0].querySelector('input').focus()
},100)
return false
}
})
}
}
}
版权声明:本文为socaicaicaicai原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。