如何使用recursion函数调用，哪个返回一些数组？

我有一个列表（ 树结构 ）。 节点（ list item ）可以有任意数量的嵌套子元素。 我必须根据给定的inputsearch一个节点（ item ）。 结果应显示search到的节点（ item ）及其子项。 下面是代码。

 import React from 'react'; import axios from 'axios'; let gTree = []; class TreeView extends React.Component { constructor(){ super(); this.printChild = this.printChild.bind(this); this.recursiveSearch = this.recursiveSearch.bind(this); this.noResultFound = this.noResultFound.bind(this); this.processPattern = this.processPattern.bind(this); var userTreeViewList = { tree: [ { "node": { "id": "1", "description": "test1", "children": [ { "node": { "id": "1_1", "description": "test1_1", "children": [ { "node": { "id": "1_1_1", "description": "test1_1_1", "children": [ { "node": { "id": "1_1_1_1", "description": "test1_1_1_1", "children": [ ] } } ] } } ] } }, { "node": { "id": "1_2", "description": "test1_2", "children": [] } } ] } }, { "node": { "id": "2", "description": "test2", "children": [ { "node": { "id": "2_1", "description": "test2_1", "children": [ { "node": { "id": "2_1_1", "description": "test2_1_1", "children": [ ] } } ] } }, { "node": { "id": "2_2", "description": "test2_2", "children": [ { "node": { "id": "2_2_1", "description": "test2_2_1", "children": [ ] } } ] } } ] } } ] }; this.state = { userTreeViewList: userTreeViewList.tree, tempUserTreeViewList: userTreeViewList.tree } } printChild(children){ return( children.map( (item, i)=> { return <ul> <li>{item.node.description}</li> {item.node.children.length>0 ? this.printChild(item.node.children): null} </ul> }) ) } processPattern(){ //it removes * from end of patten and returns var pattern= this.refs.myInput.value; var len = pattern.length if(pattern[len-1] === '*') pattern = pattern.substring(0, len-1); return pattern; } recursiveSearch(children){ //itsearch recursively the children for the pattern, and returns if found var pattern= this.processPattern(); var tree = []; if(children && children.length > 0){ children.forEach( (item) => { item.node.description.includes(pattern) ? tree.push(item) : this.recursiveSearch(item.node.children); }); } return tree; }; NameSearch(){ //on seachButton click this is called var pattern= this.processPattern(); if(pattern) var filteredUsers = []; this.state.userTreeViewList.forEach( (item)=>{ if(item.node.description.includes(pattern)){ filteredUsers.push(item); //; } else if(item.node.children.length>0){ var res = this.recursiveSearch(item.node.children); if(res.length>0 ) filteredUsers=res; } }) this.setState({ userTreeViewList: this.state.userTreeViewList, tempUserTreeViewList: filteredUsers }); } noResultFound(){ if(this.state.tempUserTreeViewList.length===0) return( <div className="alert alert-danger"> <span>No result found</span> </div> ) } render() { return ( <div> <h3>Tree View Search</h3> <hr /> <div className="row"> <div className="col-md-5"> <div className="input-group"> <input type="text" ref="myInput" className="form-control" placeholder="Search for..." /> <span className="input-group-btn"> <button className="btn btn-success" type="button" onClick={this.NameSearch.bind(this)}> <span className="glyphicon glyphicon-search"></span> Search </button> </span> </div> {this.noResultFound()} </div> </div> <ul> { this.state.tempUserTreeViewList.map( (item, i)=>{ return( <li key={i}> {item.node.description} {item.node.children.length > 0 ? this.printChild(item.node.children): null} </li> ) }) } </ul> </div> ); } } export default TreeView; 

我inputtest时的search结果

当我inputtest1_1 ，我的结果是

当我inputtest2_1 ，我的结果是

但是当我inputtest1_1_1或test2_1_1 ，我的结果是空的，但数据在那里

Answer 1

在这些方面你的algorithm有一个问题

 children.forEach( (item) => { item.node.description.includes(pattern) ? tree.push(item) : this.recursiveSearch(item.node.children); }); 

当三元运算符为false时，您将进入下一级recursion，这将启动一个新的tree数组，然后开始匹配子元素。 一旦这个匹配完成，你返回tree ，但它不存储到父tree数组，所以内部recursion结果被丢弃。

修改你的代码到这应该工作。

 item.node.description.includes(pattern) ? tree.push(item) : (tree = tree.concat(this.recursiveSearch(item.node.children))); 

但总的来说，你可以改进algorithm。 这看起来像很基本的版本。