element-ui的el-select不显示value对应的label值

显示效果如下：

期望效果如下：

调试发现： 是value的格式存在问题，读取到的数据和字段返回的数据类型不一致所导致的。

我存的字段是一个省份的字符串ID数组（11，22，33，44，55）格式，进行切割后得到的是字符串，而后台返回的集合中value是long类型的数组，由于得到的数据类型对应不上表单操作的数据类型，进行相应转换即可。

<el-form-item label="可销售省份" 
              prop="areaIds">
          <el-select v-model="dataForm.areaIds" multiple  style="width:33%"
                     placeholder="请选择可销售省份">
            <el-option
              v-for="item in areaList"
              :key="item.areaId"
              :label="item.areaName"
              :value="item.areaId"
            ></el-option>
          </el-select>
       </el-form-item>

[{“areaId”:“11”,“areaName”:“北京市”},{“areaId”:“12”,“areaName”:“天津市”},{“areaId”:“13”,“areaName”:“河北省”}]可以正常回显
[{“areaId”:11,“areaName”:“北京市”},{“areaId”:12,“areaName”:“天津市”},{“areaId”:13,“areaName”:“河北省”}]不可以回显

得知：areaId必须为字符型和表中的areaIds类型保持一致

将后端代码进行类型转换，可以使用mapperFacade进行快速转换，定义一个相同的DTO，将areaId的类型改成字符型，然后进行转换

//原先查出的省份集合
List<Area> areas = areaService.list(new LambdaQueryWrapper<Area>()
                .eq(Area::getLevel, 1));
        //将字段类型转换
        List<AreaDto> areaDtos = mapperFacade.mapAsList(areas, AreaDto.class);