ElementUi使用表单验证出现验证问题
问题:
使用vue element-ui中的form表单验证出现了输入框或者下拉框中明明有值,
但是却还是提示请输入或请选择,错误如下:
1 <el-form 2 status-icon 3 :ref="employeesRules" 4 :model="employeesForm" 5 label-width="80px" 6 :rules="employeesRules"> 7 <el-form-item 8 label="分包商" 9 prop="emSub"> 10 <el-select 11 v-model="employeesForm.subcontractor" 12 placeholder="请输入分包商"> 13 <el-option 14 v-for="item in subcontractor" 15 :value="item.scId" 16 :key="item.scId" 17 :label="item.scSubcontractorsName"> 18 </el-option> 19 </el-select> 20 </el-form-item> 21 </el-form>
解决方法:
在el-form-item中的prop属性中的值为emSub,而el-select的v-model为employeesForm.subcontractor,
所以此时获取到的值为空(即null),所以需要把prop的值和v-model对应上即可,如下:
1 <el-form 2 status-icon 3 :ref="employeesRules" 4 :model="employeesForm" 5 label-width="80px" 6 :rules="employeesRules"> 7 <el-form-item 8 label="分包商" 9 prop="subcontractor"> 10 <el-select 11 v-model="employeesForm.subcontractor" 12 placeholder="请输入分包商"> 13 <el-option 14 v-for="item in subcontractor" 15 :value="item.scId" 16 :key="item.scId" 17 :label="item.scSubcontractorsName"> 18 </el-option> 19 </el-select> 20 </el-form-item> 21 </el-form>
基本翻译
n. 转包商,分包者
希望大佬看到有不对的地方,提出博主予以改正!