【DevExpress v17.2新功能預告】DevExtreme TreeList

在即將到來的v17.2中，您能夠查看到DevExtreme HTML5 TreeList小部件的這些新功能。

1. 遞歸選擇模式

TreeList將包括一個新的遞歸選擇模式，您只需一次點擊便可選擇或取消選擇整個分支，節點上的點擊也能夠選擇或取消選擇全部的子節點。使用selection.recursive選項啓用該功能：

1 2 3 4

selection: { // … recursive: true },

在這裏您能夠看到，當咱們選擇一個子節點時，TreeList也遞歸地選擇關聯的父節點：

2. 內置搜索

若是您的TreeList包含數千條記錄，那麼很難找到一個特定的節點。這就是爲何在v17.2版本中，咱們在標頭過濾器中添加了搜索功能，以加快過濾速度。

headerFilter.allowSearch選項在widget選項根級別和列選項中可用。這容許您啓用全部列的標題過濾器搜索，或僅針對特定列。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

treeListOptions: { //... headerFilter: { //... allowSearch: true //all columns },   columns: [{ //... headerFilter: { //... allowSearch: true //specific column }, }] }

在下面的動畫中，您能夠看到如何節省時間來實現頭部過濾器搜索功能：

若是TreeList中有太多列，該怎麼辦？ 只需在列選擇器中啓用搜索框便可得到與列相同的搜索功能：

1 2 3 4

columnChooser: { //... allowSearch: true }

這使得查找列變得垂手可得，不管列選擇器模式如何，均可以使用該功能：

3. 新的Lazy加載模式

在即將發佈的版本中，您能夠經過延遲摺疊項目（及其子代）的負載來優化TreeList的性能。 在此模式下，能夠使用如下方法加載子節點：

• loadDescendants() - 遞歸加載子節點
• loadDescendants(keys) - 遞歸地加載指定節點的子節點
• loadDescendants(keys, childrenOnly) - 根據childrenOnly參數值，僅遞交特定節點的子節點或其全部子節點的單個級別

4. getNodeByKey方法

一樣在這個版本中，您能夠經過調用getNodeByKey（keyParam）獲取一個TreeList的節點：

treeListInstance.getNodeByKey(8);

此調用返回包含level、key、「visible」和「hasChildren」 flags、children數組和表示節點父級對象的完整節點。

===============================================================

想要進一步瞭解如何DevExtreme TreeList？

DevExpress v17.2即將發佈，更多精彩預告請持續關注DevExpress中文網！

掃描關注DevExpress中文網微信公衆號，及時獲取最新動態及最新資訊