以遞歸方式創建動態樹

感謝您的閱讀和幫助。這是到目前爲止，我的情況：以遞歸方式創建動態樹

我有很多數據在數據庫中，每一塊數據都有編號，parentId的（這意味着你可以找到使用該的parentId其父的ID），名稱，描述。
我想創建一個動態樹使用反應，但我不知道我有多少級別的節點。每個節點代表數據庫中的一個id。用戶在這棵樹上點擊一個節點A，其父節點等於A的ID的子節點將顯示/隱藏。

我不打算檢索所有的數據，因爲它會花費很長時間。現在，我可以通過發送請求來獲取一個節點的孩子，並得到response.body：

getChildren(id){ 
    ajax.get('http://localhost:8080/configmgmt/code/category/retriveTree/' + id) 
    .end((error, response) => { 
    if (!error && response) { 
    console.dir(response.body); 
    this.setState(subdata:response.body}); 

} else { 
    console.log('There was an error fetching from database', error); 
    } 
    } 
); 
}

在

渲染部分，我寫道：

{this.state.subdata.map((rb,index)=>{ 
      return <li><div><a href='##' onClick = {this.getChildren.bind(this,rb.id)}><em></em><label className="one_title">{rb.name}</label></a></div></li>}) 
    }

問題來了，我還是不知道如何遞歸地創建樹（因爲任何節點都可能有其子節點）。當我們只能從數據庫中獲取一個節點的子節點時如何做到這一點？

來源

2016-05-26 Kevin Zheng

我會做你的任務分爲兩步：

與負載狀態標誌的擴充樹創建一個結構。它應該有這樣的結構（這是僞代碼）：
```
class Node { 
    loaded: boolean, 
    expanded: boolean, 
    children: list<Node> 
} 
```
爲此創建一個組件：
- 如果節點未展開不呈現其子
- 如果使用點擊擴大跡象
- 如果載入子，什麼也不做，只是改變了擴展字段如果未加載
- 孩子
  - 集擴展到真正
  - 一旦請求完成發起Ajax請求
  - ，集加載到真實的，並指派兒童

創建它循環使用自身的組件不是問題。如果您不知道如何操作，請閱讀此處：how to render child components in react.js recursively

來源

2016-05-27 05:07:23

以遞歸方式創建動態樹

回答

相關問題