zoukankan      html  css  js  c++  java
  • zTree节点排序、jsTree节点排序

    数字字母混合排序可以参考:https://www.cnblogs.com/sangzs/p/12893309.html

    正文:

    项目中遇到了这个问题,网上也没找到比较清晰的答案,索性提供一个方案吧。

    原理:将整个树形插件的数据源进行排序,插件在构造UI时,自然也是按照顺序来排列的,目前这种思路适用于 zTree 和 jsTree 类库(当然jsTree本身也有自己的排序插件),其他类库大家自行尝试。

    这里拿zTree类库举例:

    未排序的效果图如下

    下面这段是zTree初始化的代码,各科树形类库大同小异,总之都有一个数据源(例如此处的 treeData

    $.fn.zTree.init($(parentContainer), setting, treeData);

    那么我们只需要在初始化之前,自己构造方法把 treeData 进行排序即可

    // 先排序
    treeData = treeData.sort(function (a, b) {
    
        // 以下是两种自定义排序规则,此处我们选择按楼层高度属性排序(由高到低)
    
        // 按节点名称字符串,进行排序
        // let param1 = a.name;
        // let param2 = b.name;
        // return param1.localeCompare(param2, "zh");
    
        // 按楼层高度属性,进行排序
        let param1 = a.elevation;
        let param2 = b.elevation;
        return param2 - param1;
    });
    
    // 再初始化
    $.fn.zTree.init($(parentContainer), setting, treeData);

    经过排序后的效果图如下

  • 相关阅读:
    HDU1196 ZOJ2417 Lowest Bit
    HDU1008 ZOJ2108 Elevator
    HDU2614 Beat
    HDU2057 A + B Again
    POJ3984 迷宫问题
    HDU1013 POJ1519 Digital Roots
    HDU2051 Bitset
    HDU2037 今年暑假不AC
    ACM入门练习与递推小结
    HDU2046 骨牌铺方格【递推】
  • 原文地址:https://www.cnblogs.com/sangzs/p/10524483.html
Copyright © 2011-2022 走看看