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>

 

subcontractor  [ˈsʌbkəntræktə(r)]  详细X
基本翻译
n. 转包商，分包者
网络释义
subcontractor: 承包商
subcontractor development: 分承包方的开发
labor subcontractor: 劳务分包单位
posted @ 2019-11-08 10:55  zaijinyang  阅读(1705)  评论(1)  编辑  收藏  举报