先声明：封装以及方法是摘自：https://www.cnblogs.com/missya/p/11247405.html直通车点这儿 改编开始：因为是自己封装的省城县，所以后台需要的参数是name参数，而不是id 刚开始我是绑定id的，图示： 虽然功能显示都正常，但是拿不到后台需要的name参数， 所以需要进行改动。图示： 这样是可以拿到id还有name，但是你选择的时候，显示的数据是乱的，最后再看了一眼文档，是这样的： 不能绑定对象… 决定做最后的挣扎 绑定字符串，id和name拼接起来，在chang事件中再剪接，然后拿到自己的想要的值，赋值给表单即可。事实证明是可行的，代码附上;
html: <el-form-item label="开户银行所在地：" prop="provinceValue" label-width="152px" class="province"> <el-select v-model="formData.provinceValue" class="city_province" placeholder="请选择开户行所在省份" @change="selectProvimce" @visible-change="changeIcon"> <el-option v-for="(item,index) of provincearr" :key="index" :label="item.name" :value="item.name + ',' + item.id" ></el-option> </el-select> <img src="../../assets/releaseProgress/xiala.png" alt="" class="selectIcon" :class="{'isChange': isChange}"> </el-form-item> <el-form-item label="" prop="cityValue" class="city"> <el-select v-model="formData.cityValue" class="city_city" placeholder="请选择开户行所在城市" @change="selectCity" @visible-change="changeIcon1"> <el-option v-for="(item,index) of cityarr" :key="index" :label="item.name" :value="item.name + ',' + item.id" ></el-option> </el-select> <img src="../../assets/releaseProgress/xiala.png" alt="" class="selectIcon" :class="{'isChange1': isChange1}"> </el-form-item> <el-form-item label="" prop="regionValue" class="region"> <el-select placeholder="请选择开户行所属区县" class="city_area" @change="selectRegion" v-model="formData.regionValue" @visible-change="changeIcon2"> <el-option v-for="(item,index) of regionarr" :key="index" :label="item.name" :value="item.name + ',' + item.id" ></el-option> </el-select> <img src="../../assets/releaseProgress/xiala.png" alt="" class="selectIcon" :class="{'isChange2': isChange2}"> </el-form-item> js: // 选中省获取城数据 selectProvimce (id) { let provimceLength = id.length // 获取字符串长度 let newStr = id.substring(provimceLength-6, provimceLength) // 获取到切好的省id this.provimceCode = parseInt(newStr.substring(0, 2)) // 获取省编码（前两位） this.cityarr = [] this.regionarr = [] this.formData.cityValue = '' this.formData.regionValue = '' // 返回字符串中一个子串第一处出现的索引（从左到右搜索）。如果没有匹配项，返回 -1 。（因为name的长度不固定，所以在html中手动添加逗号做标记） let strIndex = id.indexOf(',') // 剪接 let newName = id.substring(0, strIndex) // 拿到name this.formData.provinceValue = newName for (const item of this.provincearr) { if (newName === item.name) { this.cityarr = item.children } } },如果你想用id判断，并且又需要到name，那可以这样
// 选中市获取县数据 selectCity (id) { let cityLength = id.length // 获取字符串长度 let newCityStr = id.substring(cityLength-6, cityLength) // 获取到切好的市id this.cityCode = parseInt(newCityStr.substring(0, 4)) // 获取到市编码（前四位） this.regionarr = [] this.formData.regionValue = '' let strIndex = id.indexOf(',') // 前切 let newName = id.substring(0, strIndex) this.formData.cityValue = newName // 拿到id let newLength = id.length // id都是6位数（后切） let newId = id.substring(newLength-6, newLength) for (const item of this.cityarr) { if (newId === item.id) { this.regionarr = item.children } } }, // 选中县 selectRegion (id) { let regionLength = id.length // 获取字符串长度 this.regionCode = parseInt(id.substring(regionLength - 6, regionLength)) // 县编码（6位） let strIndex = id.indexOf(',') let newName = id.substring(0, strIndex) this.formData.regionValue = newName }但是这样会多了几行代码，所以看你具体需求吧。
解决问题的方法很多，但我总是找不到一个，哈哈
