项目场景：
下拉框动态获取在后端 constant 中定义好的 常量类型
问题描述
常量的定义当从0一直排序，当前的接口获取到的动态列表正确，但是当特殊情况前几种类型不显示，即不是从 0 开始，只显示用户想要显示的选项，会出现空值的现象
// List faultTypeMaps = Arrays.asList(“无法启动”, “中断扫描”, “间接性故障”,“其他”); //0无法启动 1中断扫描 2间接性故障 3其他
List faultTypeMaps = Arrays.asList(“无法启动”, “中断扫描”, “间接性故障”,“其他”,“服务合同”, “保外维修”, “单次保养”,“销售让步”); //4服务合同 5保外维修 6单次保养 7销售让步：保外不收费维修
List faultRankMaps = Arrays.asList(“一般”, “严重”, “紧急”,“技术改造”);
List statusMaps = Arrays.asList(“待派工”, “已派工”, “接单”, “维修中”, “完成”);//0 1 2 3 4
List serviceTypeMaps = Arrays.asList(“服务合同”, “单次维修”, “保养”, “优化服务”);//0 1 2 3
@RequestMapping(“/opt“)
public R opt(@RequestBody Map<String, Object> params){
String type = params.get("type").toString();
List<String> list = new ArrayList<>();
if(type.equals("faultType")){
list = faultTypeMaps;
}else if(type.equals("faultRank")){
list = faultRankMaps;
}else if(type.equals("status")){
list = statusMaps;
}else if(type.equals("serviceType")){
list = serviceTypeMaps;
}
List<Map<String, Object>> listMaps = new ArrayList<>();
for(int i = 0; i <list.size();i++) {
Map<String, Object> map = new HashMap<>();
map.put("key", list.get(i));
map.put("value", i);
listMaps.add(map);
}
return R.ok().putData(listMaps);
}
方式二：
（不使用最顶端的 list）
@RequestMapping("/opt")
public R opt(@RequestBody Map<String, Object> params){
String type = params.get("type").toString();
Map<Integer,String> map = new HashMap<>();
if(type.equals("faultType")){
map = RepairConstant.FAULT_TYPE;
}else if(type.equals("faultRank")){
map = RepairConstant.FAULT_RANK;
}else if(type.equals("status")){
map = RepairConstant.STATUS;
}
List<Map<String, Object>> listMaps = new ArrayList<>();
for(int i = 0; i <list.size();i++) {
Map<String, Object> map = new HashMap<>();
map.put("key", list.get(i));
map.put("value", i);
listMaps.add(map);
}
return R.ok().putData(listMaps);
}
定义常量：
public class RepairConstant {
/** 维修状态 */
public static final Map<Integer,String> STATUS = new HashMap<>();
/**一般,严重,紧急,技术改造*/
public static final Map<Integer,String> FAULT_RANK = new HashMap<>();
/**无法启动,屏幕不亮,外光破损,其他*/
public static final Map<Integer,String> FAULT_TYPE = new HashMap<>();
//维修类型
public static final Map<Integer,String> REPAIR_TYPE = new HashMap<>();
//维修类型
public static final Map<Integer,String> SERVICE_TYPE = new HashMap<>();
static {
STATUS.put(0, "待派工");
STATUS.put(1, "已派工");
STATUS.put(2, "接单");
STATUS.put(3, "维修中");
STATUS.put(4, "完成");
FAULT_RANK.put(0, "一般");
FAULT_RANK.put(1, "严重");
FAULT_RANK.put(2, "紧急");
FAULT_RANK.put(3, "技术改造");
// FAULT_TYPE.put(0, “无法启动”);
// FAULT_TYPE.put(1, “屏幕不亮”);
// FAULT_TYPE.put(2, “外光破损”);
// FAULT_TYPE.put(3, “其他”);
// FAULT_TYPE.put(0, “无法启动”);
// FAULT_TYPE.put(1, “中断扫描”);
// FAULT_TYPE.put(2, “间接性故障”);
// FAULT_TYPE.put(3, “其他”);
FAULT_TYPE.put(4, “服务合同”);
FAULT_TYPE.put(5, “保外维修”);
FAULT_TYPE.put(6, “单次保养”);
FAULT_TYPE.put(7, “销售让步”); //服务合同 保外维修 单次保养 销售让步修
REPAIR_TYPE.put(0, "内修");
REPAIR_TYPE.put(1, "外修");
REPAIR_TYPE.put(2, "保修");
// SERVICE_TYPE.put(0, “服务合同”); // 0 服务合同：已签订维保合同
// SERVICE_TYPE.put(1, “单次维修”); // 1 单次维修：保外另收费维修
// SERVICE_TYPE.put(2, “保养”); // 2 保养：保外另收费保养
// SERVICE_TYPE.put(3, “优化服务”); // 3 优化服务：保外不收费维修”
}
}
前端
<el-form-item prop="faultTypeName" label="报修类型">
<im-selector placeholder=""
v-model="dataForm.faultType"
:mapModel.sync="dataForm"
:dataParam="faultTypeParam"
mapKeyVal="faultRankName:faufaultTypeltRank"
dataType='static'
cusUrl="/repair/opt" >
</im-selector>
</el-form-item>
faultRankParam:{type:'faultRank', query:''},
faultTypeParam:{type:'faultType', query:''},
原因分析：
例如：Handler 发送消息有两种方式，分别是 Handler.obtainMessage()和 Handler.sendMessage()，其中 obtainMessage 方式当数据量过大时，由于 MessageQuene 大小也有限，所以当 message 处理不及时时，会造成先传的数据被覆盖，进而导致数据丢失。
解决方案：
@RequestMapping("/opt")
public R opt(@RequestBody Map<String, Object> params){
String type = params.get("type").toString();
// List<String> list = new ArrayList<>();
Map<Integer,String> map = new HashMap<>();
if(type.equals("faultType")){
map = RepairConstant.FAULT_TYPE;
}else if(type.equals("faultRank")){
map = RepairConstant.FAULT_RANK;
}else if(type.equals("status")){
map = RepairConstant.STATUS;
}
List<Map<String, Object>> listMaps = new ArrayList<>();
// for(int key: map.keySet()) {
// Map<String, Object> item = new HashMap<>();
// item.put("value", key);
// item.put("key", map.get(key));
// listMaps.add(item);
// }
for(int i = 0; i <map.size();i++) {
Map<String, Object> item = new HashMap<>();
item.put("key", item.get(i));
item.put("value", i);
listMaps.add(item);
}
return R.ok().putData(listMaps);
}
获取都的数据为正确数据列表：
获取到数据列表：
当然，查询时的查询组件也可以 使用 el-select ，即：
<el-form-item prop="faultType" label="报修类型">
<el-select v-model="dataForm.faultType" clearable placeholder="请选择">
<!-- <el-option label="无法启动" value="0"></el-option>
<el-option label="中断扫描" value="1"></el-option>
<el-option label="间接性故障" value="2"></el-option> -->
<el-option label="服务合同" value="4"></el-option>
<el-option label="保外维修" value="5"></el-option>
<el-option label="单次保养" value="6"></el-option>
<el-option label="销售让步" value="7"></el-option>
<el-option label="其他" value="3"></el-option>
</el-select>
</el-form-item>
还有一种就是使用过 el-cascader 然后调用方法进行获取list
例如：
<el-form-item prop="deptId" label="科室">
<el-cascader
clearable
:options="deptList"
:props="deptOptionProps"
v-model="dataForm.deptId"
placeholder="请选择"
@focus="getDeptList"
filterable
>
</el-cascader>
</el-form-item>
**方法：**
//获取部门列表
getDeptList (id) {
if(id > 0){
this.$axios.post('/sys/dept/dept_select',{"parentId":id}).then(res => {
this.deptList = res
}).catch(() => {})
}
return;
},
如果觉得上述几种方法都不合适的话，我们也可以自己写一个组件。
我们平时用到的都是开源的组件，可直接使用，但有时候不一定适合我们的实际场景，例如：我们平时开发的项目此目录下的都是可以直接使用的组件。
##总结：
实现一个功能有时会有很多种方法，在此记录一下自己遇到的问题及解决办法。
原文地址:https://blog.csdn.net/YHLSunshine/article/details/123718653
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若转载，请注明出处：http://www.7code.cn/show_41002.html
如若内容造成侵权/违法违规/事实不符，请联系代码007邮箱：suwngjj01@126.com进行投诉反馈，一经查实，立即删除！
