数据格式:

[
{
"id":"d3e8a9d6-e4c6-4dd8-a94f-07733d3c1b59",
"parentId":"6d460008-38f7-479d-b6d1-058ebc17dae3",
"myorder":1,
"name":"任务一"
},
{
"id":"6d460008-38f7-479d-b6d1-058ebc17dae3",
"parentId":"33978737-c722-4339-88a1-a9829dd4bca2",
"myorder":1,
"name":"项目一"
},
{
"id":"33978737-c722-4339-88a1-a9829dd4bca2",
"parentId":"5461ed61-543c-4ea1-9cb5-17b008e093a0",
"myorder":1,
"name":"课题一"
},
{
"id":"5461ed61-543c-4ea1-9cb5-17b008e093a0",
"parentId":"57e06272-eab4-4920-ae6a-25e055374851",
"myorder":1,
"name":"电子教案"
},
{
"id":"8d0723db-9087-4c83-8d0e-ab7f24ddf066",
"parentId":"6d460008-38f7-479d-b6d1-058ebc17dae3",
"name":"任务二",
"myorder":2
}
]
 var _data = ${videoList}
// 将偏平化的数组转为树状结构 -- id为根节点
function filterArray(data, id) {
var fa = function(parentid) {
var _array = [];
for (var i = 0; i < data.length; i++) {
var n = data[i];
if (n.parentId === parentid) {
n.children = fa(n.id);
_array.push(n);
}
}
return _array;
}
return fa(id);
}
  //根据myorder排序
function _sort(data){
for(var i =0; i<data.length; i++){
_sort(data[i].children)
}
data.sort(function(a,b){
return a.myorder>b.myorder
})
}
var data = filterArray(_data, id)
_sort(data)

js List<Map> 将偏平化的数组转为树状结构并排序的更多相关文章

  1. js生成动态树状结构及排序

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 原生JS实现树状结构列表

    树状结构列表,这个技术点之前有写过了,是基于vue讲解,但似乎都没有解决痛点,最基础的原生JS该怎么实现呢? 这篇文章会全面详细的介绍树状结构列表的实现,从数据处理成树状结构,到动态生成dom节点渲染 ...

  3. 使用Map辅助拼装树状结构,消除递归调用

    目前菜单或其他树状结构在数据库中的存储,多数是以一个parentid作为关联字段,以一维形式存储.使用时全部查询出来,然后在内存中拼装成树状结构.现在主要涉及的是拼装方法的问题. 一般可以进行 递归调 ...

  4. JQuery 树状结构 jQuery-treeview.js 插件

    由简入繁实现Jquery树状结构 在项目中,我们经常会需要一些树状结构的样式来显示层级结构等,比如下图的样式,之前在学.net的时候可以直接拖个服务端控件过来直接使用非常方便.但是利用Jquery的一 ...

  5. D3.js系列——布局:弦图和集群图/树状图

    一.弦图 1.弦图是什么 弦图(Chord),主要用于表示两个节点之间的联系的图表.两点之间的连线,表示谁和谁具有联系. 2.数据 初始数据为: var city_name = [ "北京& ...

  6. js 每日一更(数组转换成前端更容易解析的树状结构)

    <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content ...

  7. js中把ajax获取的数据转化成树状结构(并做成多级联动效果)

    1.首先通过ajax获取数据,此处省略,直接贴出获取到的数据格式 var arr = [{ id: 1, name: "一级标题", pid: 0 }, { id: 2, name ...

  8. js实现右下角可关闭最小化div

    本实例使用Javascript实现右下角可关闭最小化div,可以用于展示推荐内容,效果预览网址:http://keleyi.com/keleyi/phtml/xuanfudiv/3.htm效果图片: ...

  9. js模拟Map对象,实现key---value

    js模拟Map对象,实现key---value 根据java中map的属性,实现key----value保存 function Map() { var struct = function (key, ...

随机推荐

  1. 模拟IIC协议时序

    IIC是飞利浦公司开发的两线式串行总线,主要应用在单片机和外围电子器件之间的数据通讯. IIC总线优点是节约总线数,稳定,快速,是目前芯片制造上非常流行的一种总线,大多数单片机已经片内集成了IIC总线 ...

  2. log4j2日志

    log4j2.xmllog4j-api-2.5.jarlog4j-core-2.5.jar <?xml version="1.0" encoding="UTF-8& ...

  3. Linux下wps字体问题

    1.安装symbol-fonts_1.2_all.deb,自行搜索 2.卸载xfonts-mathml字体 sudo apt-get remove xfonts-mathml

  4. 10- python 网络爬虫分析

    Python 网络爬虫简单分析 import urllib2 response = urllib2.urlopen("http://www.baidu.com") print re ...

  5. HDU 5812 Distance

    从a变到b,也就是将a一直除素因子,除到1为止,然后乘b的素因子,一直乘到b. 但是gcd(a,b)部分是不用除下去的.所以d(a,b)=a/gcd(a,b)的素因子个数+b/gcd(a,b)的素因子 ...

  6. js如何在指定页面跳转到另一指定页面

    要实现从一个页面A跳到另一个页面B,js实现就在A的js代码加跳转代码 JS跳转大概有以下几种方式: 第一种:(跳转到b.html)<script language="javascri ...

  7. boolean类型相关

    如果逻辑对象无初始值或者其值为 0.-0.null."".false.undefined 或者 NaN,那么对象的值为 false.否则,其值为 true(即使当自变量为字符串 & ...

  8. Lambda表达式介绍

    Lambda表达式实际上是一个匿名函数.它包含表达式和语句,常用于创建委托或表达式目录树类型.所有Lambda表达式都是用Lambda运算符----------  =>,该运算符读为" ...

  9. configure PUTTY to not time out

    To modify an existing session with "keep alives" to maintain your connection follow the st ...

  10. PHP: 异常exception

    异常最常见于SDK调用中,函数执行失败时抛出异常,顺带错误码和错误信息. 先来看下PHP的异常处理相关函数: public Exception::__construct() ([ string $me ...