Java【代码分享 13】前端动态添加一条记后端使用JDK1.8实现map对象根据key的部分值进行分组(将map对象封装成指定entity对象)

简介: Java【代码分享 13】前端动态添加一条记后端使用JDK1.8实现map对象根据key的部分值进行分组(将map对象封装成指定entity对象)

why

我是后端开发工程师,前端的很多函数不是很了解,所以很多问题期望在后端进行处理。

前端

有这样一个实现,前端要动态添加记录,然后将记录统一存储在一个字段里,代码如下:

// 动态添加一行输入参数描写
function addParamIn() {
    // 输入参数列表
    var paramInList = $('#paramInList');
    // 添加一行
    var tr = $(['<tr>'
        , '<td ><input type="text" name="paramIn-' + data.paramInNum + '-name" placeholder = "输入字段英文名" value="" class="layui-input"></td>'
        , '<td ><input type="text" name="paramIn-' + data.paramInNum + '-cn" placeholder = "输入字段中文名" value="" class="layui-input"></td>'
        , '<td ><select name="paramIn-' + data.paramInNum + '-type" lay-verify="required"> <option value="date">时间</option><option value="varchar">字符串</option></select></td>'
        , '<td ><input type="text" name="paramIn-' + data.paramInNum + '-map" placeholder = "输入映射字段名" value="" class="layui-input"></td>'
        , '<td ><select name="paramIn-' + data.paramInNum + '-isRequired" lay-verify="required"> <option value="1">是</option><option value="0">否</option></select></td>'
        , '<td ><input type="text" name="paramIn-' + data.paramInNum + '-defaultVal" placeholder = "输入默认值" value="" class="layui-input"></td>'
        , '<td>'
        , '<button class="layui-btn layui-btn-xs layui-btn-danger specialConfig-delete">删除</button>'
        , '</td>'
        , '</tr>'].join(''));
    // 删除当前行
    tr.find('.specialConfig-delete').on('click', function () {
        tr.remove();
    });
    // 页面追加一行、输入参数个数加一
    paramInList.append(tr);
    // 重新渲染 下拉选
    form.render("select");
    data.paramInNum += 1;
}

可以看的出来,传输到后端后,输入参数是多个map对象,比如:

{
// 其他参数
"source":"sourceTableName",
"view":"全部展示",
"desc":"查询特殊时段的异常信息",
...
// 输入参数【主要要处理的】
// 第一行
"paramIn-0-name":"test_param",
"paramIn-0-cn":"测试参数",
"paramIn-0-type":"字符串",
"paramIn-0-map":"testParam",
"paramIn-0-isRequired":"1",
"paramIn-0-defaultVal":"测试成功",
// 第二行
"paramIn-1-name":"test_param2",
"paramIn-1-cn":"测试参数2",
"paramIn-1-type":"日期",
"paramIn-1-map":"testParam2",
"paramIn-1-isRequired":"0",
"paramIn-1-defaultVal":"测试失败",
// ... 还有很多行
// 动态的输出参数【跟输入参数一样,这里不再贴出】
}

后端处理

// 进行分组【这里过滤了输入参数paramIn 和输出参数 paramOut 进行分组处理】
// paramIn-000-name 分组key为 paramIn-000
Map<String, List<Map.Entry<String, Object>>> paramIn = mapParam.entrySet().stream().filter(map -> map.getKey().contains("paramIn")).collect(Collectors.groupingBy(map -> {
            String key = map.getKey();
            return key.substring(0, key.indexOf("-", 8));
        }));
// paramOut-000-name 分组key为 paramOut-000 
Map<String, List<Map.Entry<String, Object>>> paramOut = mapParam.entrySet().stream().filter(map -> map.getKey().contains("paramOut")).collect(Collectors.groupingBy(map -> {
            String key = map.getKey();
            return key.substring(0, key.indexOf("-", 9));
        }));
// 封装
ArrayList<SpecialConfigParaIn> paraInArrayList = new ArrayList<>();
paramIn.forEach((key, val) -> {
  // 这里实现了key值的处理,使其与entity的字段对应
  Map<String, Object> stringObjectMap = changeKeysToEntity(val, key);
  SpecialConfigParaIn specialConfigParaIn = JSON.parseObject(JSON.toJSONString(stringObjectMap), SpecialConfigParaIn.class);
            paraInArrayList.add(specialConfigParaIn);
        });
        specialConfig.setParamIn(JSON.toJSONString(paraInArrayList));
/**
* 处理所有key值
*
* @param mapList    需要处理所有key值的对象
* @param replaceStr 要替换的字符串
* @return Map<String, Object>
*/
private Map<String, Object> changeKeysToEntity(List<Map.Entry<String, Object>> mapList, String replaceStr) {
        Map<String, Object> returnMap = new HashMap<>(8);
        mapList.forEach(map -> {
            returnMap.put(map.getKey().replace(replaceStr, "").replace("-", ""), map.getValue());
        });
        return returnMap;
    }

总结

如果前端可以进行处理自然是最佳的,前端无法处理,在后端解决问题也不是不行。

目录
相关文章
|
3月前
|
缓存 前端开发 JavaScript
利用代码分割优化前端性能:策略与实践
在现代Web开发中,代码分割是提升页面加载性能的有效手段。本文介绍代码分割的概念、重要性及其实现策略,包括动态导入、路由分割等方法,并探讨在React、Vue、Angular等前端框架中的具体应用。
|
10天前
|
Java API 数据安全/隐私保护
探索Java动态代理的奥秘:JDK vs CGLIB
动态代理是一种在 运行时动态生成代理类的技术,无需手动编写代理类代码。它通过拦截目标方法的调用,实现对核心逻辑的 无侵入式增强(如日志、事务、权限控制等)。
38 0
探索Java动态代理的奥秘:JDK vs CGLIB
|
26天前
|
算法 Java 编译器
深入理解 Java JDK —— 让我们从基础到进阶
JDK(Java Development Kit)是 Java 开发的核心工具包,包含编译、运行和调试 Java 程序所需的所有工具和库。它主要由 JVM(Java 虚拟机)、JRE(Java 运行时环境)和 Java 核心类库组成。JVM 是跨平台运行的基础,负责字节码的加载、执行和内存管理;JRE 提供运行 Java 应用的环境;核心类库则提供了丰富的 API 支持。通过编写、编译和运行一个简单的 Java 程序,可以深入理解 JDK 的工作原理。此外,JDK 还提供了 JIT 编译、垃圾回收优化和并发工具包等高级功能,帮助开发者提高程序性能和稳定性。
103 10
|
26天前
|
前端开发 NoSQL Java
【Java若依框架】RuoYi-Vue的前端和后端配置步骤和启动步骤
本文介绍了如何配置和启动基于Java的若依(RuoYi)项目,涵盖后端和前端的详细步骤。首先,准备Redis、MySQL以及IDE(如Idea和VS)。接着,通过GitHub获取代码并导入到IDE中,执行必要的SQL文件和配置数据库密码。然后,启动Redis并进行相关配置。最后,按照前端配置步骤克隆前端代码库,打开终端执行命令完成前端配置。整个过程详细记录了每一步的操作,帮助开发者顺利部署若依项目。 如果你觉得有帮助,请点赞、关注和收藏,这将是我持续分享的动力!
272 1
|
2月前
|
开发框架 小程序 前端开发
圈子社交app前端+后端源码,uniapp社交兴趣圈子开发,框架php圈子小程序安装搭建
本文介绍了圈子社交APP的源码获取、分析与定制,PHP实现的圈子框架设计及代码编写,以及圈子小程序的安装搭建。涵盖环境配置、数据库设计、前后端开发与接口对接等内容,确保平台的安全性、性能和功能完整性。通过详细指导,帮助开发者快速搭建稳定可靠的圈子社交平台。
|
2月前
|
机器学习/深度学习 前端开发 算法
婚恋交友系统平台 相亲交友平台系统 婚恋交友系统APP 婚恋系统源码 婚恋交友平台开发流程 婚恋交友系统架构设计 婚恋交友系统前端/后端开发 婚恋交友系统匹配推荐算法优化
婚恋交友系统平台通过线上互动帮助单身男女找到合适伴侣,提供用户注册、个人资料填写、匹配推荐、实时聊天、社区互动等功能。开发流程包括需求分析、技术选型、系统架构设计、功能实现、测试优化和上线运维。匹配推荐算法优化是核心,通过用户行为数据分析和机器学习提高匹配准确性。
163 3
|
2月前
|
缓存 监控 前端开发
探索前端性能优化:关键策略与代码实例
本文深入探讨前端性能优化的关键策略,结合实际代码示例,帮助开发者提升网页加载速度和用户体验,涵盖资源压缩、懒加载、缓存机制等技术。
|
3月前
|
Oracle 安全 Java
深入理解Java生态:JDK与JVM的区分与协作
Java作为一种广泛使用的编程语言,其生态中有两个核心组件:JDK(Java Development Kit)和JVM(Java Virtual Machine)。本文将深入探讨这两个组件的区别、联系以及它们在Java开发和运行中的作用。
159 1
|
3月前
|
IDE Java 编译器
开发 Java 程序一定要安装 JDK 吗
开发Java程序通常需要安装JDK(Java Development Kit),因为它包含了编译、运行和调试Java程序所需的各种工具和环境。不过,某些集成开发环境(IDE)可能内置了JDK,或可使用在线Java编辑器,无需单独安装。
131 2
|
3月前
|
Web App开发 缓存 监控
前端性能优化实战:从代码到部署的全面策略
前端性能优化实战:从代码到部署的全面策略
54 1

热门文章

最新文章

  • 1
    探索Java动态代理的奥秘:JDK vs CGLIB
  • 2
    Java后端开发-使用springboot进行Mybatis连接数据库步骤
  • 3
    【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
  • 4
    【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 5
    【05】flutter完成注册页面完善样式bug-增加自定义可复用组件widgets-严格规划文件和目录结构-规范入口文件-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
  • 6
    docker安装nginx,前端项目运行
  • 7
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 8
    详解智能编码在前端研发的创新应用
  • 9
    巧用通义灵码,提升前端研发效率
  • 10
    【03】完整flutter的APP打包流程-以apk设置图标-包名-签名-APP名-打包流程为例—-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈 章节内容【03】