网站浏览器推广网站要注意什么

1. 在对应的input/select等框上添加ref属性，直接根据ref就可精确地获取到元素，代码案例如下：

 <el-form ref="bpmData" :model="bpmData" :rules="formRules"><el-form-item label="项目名称：" prop="name" class="lineblock"><el-input ref="name" v-model.trim="bpmData.name" placeholder="请输入项目名称" maxlength="100" show-word-limit:disabled="((!bpmData.id && false) || (bpmData.id && false))"></el-input></el-form-item><el-form-item label="项目需求：" prop="projectRequirementName"><el-input v-model.trim="bpmData.projectRequirementName" placeholder="请选择项目需求" @focus="chooseRequirement":disabled="bpmData.id ? true : false" @callBackRequirement="callBackRequirement"></el-input></el-form-item></el-form>

2. element-ui自带的表单验证返回中包含一个invalidFields对象，此对象包含了验证失败的所有属性名。然后for循环使用即可，就可以实现自动定位失败输入框位置并自动获取焦点。代码案例如下：

 // 根据判断为空自动获取为空情况下的焦点focusInput() {this.$refs['bpmData'].validate((valid,invalidFields) => {console.log(valid)if(valid){// 验证通过} else {// 验证失败//invalidFields对象，此对象包含了验证失败的所有属性名for (let obj in invalidFields) {this.$refs[obj].focus();break;}}})},

以上就是解决elementUI表单校验自动聚焦到失败的输入框问题解决方案。如有侵权，请联系本人删除