首页 > 解决方案 > 搜索列表,只需要叶子

问题描述

我有来自Patrick Brockmann 的 CollapsibleTree Search的以下代码,它使用 D3 树节点填充 Select2 列表。我想改变它,所以只有最后一个节点/叶子在列表中,而不是父节点。我怎样才能做到这一点?

//===============================================
            function select2DataCollectName( d ) {
                if ( d.children )
                    d.children.forEach( select2DataCollectName );
                else if ( d._children )
                    d._children.forEach( select2DataCollectName );
                select2Data.push( d.name );
            }

            //===============================================
            function searchTree( d ) {
                if ( d.children )
                    d.children.forEach( searchTree );
                else if ( d._children )
                    d._children.forEach( searchTree );
                var searchFieldValue = eval( searchField );
                if ( searchFieldValue && searchFieldValue.match( searchText ) ) {
                    // Walk parent chain
                    var ancestors = [];
                    var parent = d;
                    while ( typeof ( parent ) !== "undefined" ) {
                        ancestors.push( parent );
                        //console.log(parent);
                        parent.class = "found";
                        parent = parent.parent;
                    }
                    //console.log(ancestors);
                }
            }
            //===============================================

    $( "#search" ).on( "select2-selecting", function ( e ) {
                clearAll( root );
                expandAll( root );
                update( root );
                searchField = "d.name";
                searchText = e.object.text;
                searchTree( root );
                root.children.forEach( collapseAllNotFound );
                update( root );
            } )

标签: javascriptd3.js

解决方案


最好的想法是重构所有的功能......

function select2DataCollectName(d) {
  if (d.children)
    d.children.forEach(select2DataCollectName);
  else if (d._children)
    d._children.forEach(select2DataCollectName);
  select2Data.push(d.name);
}

...以避免不必要的递归。

但是,作为一个快速的答案,您可以简单地检查对象中是否没有children属性:

if(!d.children) select2Data.push(d.name);

这是分叉的 bl.ocks:http ://bl.ocks.org/GerardoFurtado/75f9ac822aace4165caeca1708ee510d/2e24099a8f7d6157783f9d2099754d6abc085a93


推荐阅读