sunny123456

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::
  1796 随笔 :: 22 文章 :: 24 评论 :: 226万 阅读
< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

js中对list数组数据进行Map数据结构改造

后端返回的数据类型是list数组

[
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371219,
        "taskCompleteTime":1590634371221,
        "taskHandler":"1111",
        "taskHandlerType":null,
        "taskHandlerOpinion":null,
        "taskHandlerLink":null,
        "taskHandlerDescription":null,
        "taskPractitioner":"1111",
        "taskId":null,
        "taskName":"开始",
        "actId":"start",
        "actName":"开始",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":null,
        "logisticsNum":null
    },
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371221,
        "taskCompleteTime":1590634371236,
        "taskHandler":"1111",
        "taskHandlerType":null,
        "taskHandlerOpinion":null,
        "taskHandlerLink":null,
        "taskHandlerDescription":null,
        "taskPractitioner":"1111",
        "taskId":"472718072751329281",
        "taskName":"代理商申请",
        "actId":"service",
        "actName":"代理商申请",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":null,
        "logisticsNum":null
    },
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371237,
        "taskCompleteTime":null,
        "taskHandler":"刘智慧",
        "taskHandlerType":null,
        "taskHandlerOpinion":null,
        "taskHandlerLink":null,
        "taskHandlerDescription":null,
        "taskPractitioner":"刘智慧",
        "taskId":"472718072835215362",
        "taskName":"商务审批",
        "actId":"business",
        "actName":"商务审批",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":null,
        "logisticsNum":null
    },
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371247,
        "taskCompleteTime":null,
        "taskHandler":"Lisa",
        "taskHandlerType":null,
        "taskHandlerOpinion":null,
        "taskHandlerLink":null,
        "taskHandlerDescription":null,
        "taskPractitioner":"Lisa",
        "taskId":"472718072860381187",
        "taskName":"商务审批",
        "actId":"business",
        "actName":"商务审批",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":null,
        "logisticsNum":null
    },
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371253,
        "taskCompleteTime":null,
        "taskHandler":"KiKi",
        "taskHandlerType":null,
        "taskHandlerOpinion":null,
        "taskHandlerLink":null,
        "taskHandlerDescription":null,
        "taskPractitioner":"KiKi",
        "taskId":"472718072885547009",
        "taskName":"商务审批",
        "actId":"business",
        "actName":"商务审批",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":null,
        "logisticsNum":null
    },
    {
        "processStartUser":"1111",
        "taskCreateTime":1590634371258,
        "taskCompleteTime":null,
        "taskHandler":"",
        "taskHandlerType":"",
        "taskHandlerOpinion":"",
        "taskHandlerLink":"",
        "taskHandlerDescription":"",
        "taskPractitioner":"测试商务",
        "taskId":"472718072906518531",
        "taskName":"商务审批",
        "actId":"business",
        "actName":"商务审批",
        "process_defined_id":null,
        "process_instance_id":null,
        "taskAuditStatus":"approving",
        "taskStatus":"approvePending",
        "logisticsNum":""
    }
]

在js中对list数组进行Map数据结构的改造

//Map数组中的key集合数组
    $ctrl.allActList = $ctrl.follow.map(function(item){
        return item.actName
    })
// key数组去重
    $ctrl.equalList = _.uniq($ctrl.allActList)
    // 创建Map并set数据
    $ctrl.mapList = new Map()
    $ctrl.equalList.map(function(item){
        var valueList = []
        $ctrl.follow.map(function(e){
            if(e.actName == item)
                valueList.push(e)
                $ctrl.mapList.set(item,valueList) 
        })
    })

对应的HTML中的代码

其中在HTML中可以通过$ctrl.mapList.get()获取值

<div ng-repeat="item in $ctrl.equalList">
    <div style="position:relative;overflow:hidden">
        <div class="app-line" style="top:20px"></div>
        <div class="dib renew-re" style="top:-4px">
            <i class="iconfont icon-time circle-gray" ng-show="!item.taskCompleteTime"></i>
            <i class="iconfont icon-zhengque circle-yellow" ng-show="item.taskCompleteTime"></i>
        </div>
        <div class="dib ml20 vertical-top" style="max-width:90%">
            <p>{{item}}</p>
            <p ng-repeat="e in $ctrl.mapList.get(item)">处理人:{{e.taskHandler}}
                <span ng-show="!e.taskHandler">等待审核</span>
                <span ng-show="e.taskHandlerType=='approveReturned'">已退回</span>
                <span ng-show="e.taskHandlerType=='approveWithdrawed'">已撤回 撤回环节:{{e.taskHandlerLink}}
                </span>
                <span>{{e.taskHandlerOpinion}}</span>
                <span class="ml10">{{e.taskCompleteTime | date:'yyyy-MM-dd HH:mm:ss'}}</span>
            </p>
                   
        </div>
    </div>
</div>

循环list套list比较慢,时间复杂度是m*n,list里面用Map取比较快,时间复杂度m+n。

https://blog.csdn.net/adoreen/article/details/106401345?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~aggregatepage~first_rank_ecpm_v1~rank_v31_ecpm-1-106401345.pc_agg_new_rank&utm_term=js%E5%90%91list%E6%95%B0%E7%BB%84%E6%B7%BB%E5%8A%A0map&spm=1000.2123.3001.4430
posted on   sunny123456  阅读(1570)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· .NET10 - 预览版1新功能体验(一)
点击右上角即可分享
微信分享提示