文檔:
組件功能較多,已整理出了專門的文檔發(fā)布在獨立的服務器上,
詳細請看:
http://www.wisdomelon.com/DTreeHelper/ (最好用Chrome瀏覽器打開)(點擊左側來源可直接查看)
問題討論:
https://fly.layui.com/jie/43868/ 問題討論:
https://fly.layui.com/jie/52635/
文檔源碼:點擊左側下載,可以去gitee或github下載
QQ群:867324214(添加時請備注layui交流。)
更新預告:
暫無
版本說明(倒序,新的版本表示提供的zip壓縮包有更新,請下載最新的哦):
------------------------v2.5.7(2020/01/19)【優(yōu)化】:------------------------
【修復】select模塊修復:當設置默認值時,存在點擊select面板后,默認值消失的問題。
【修復】select模塊修復:帶復選框的下拉樹設置默認值無效的問題。
【修復】內置屬性修復:修復response設置了checked和type映射卻無效的問題
【新增】內置函數(shù)新增:fuzzySearch,模糊查詢,搜索節(jié)點,保留父節(jié)點。
【優(yōu)化】內置函數(shù)優(yōu)化:setDisabledNodes,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【新增】內置函數(shù)新增:setDisabledNode,設置單個節(jié)點的禁用
【優(yōu)化】內置函數(shù)優(yōu)化:cancelDisabledNodes,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【新增】內置函數(shù)新增:cancelDisabledNode,設置單個節(jié)點的取消禁用
【優(yōu)化】內置函數(shù)優(yōu)化:getDisabledNodesParam,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【優(yōu)化】內置函數(shù)優(yōu)化:setHideNodes,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【新增】內置函數(shù)新增:setHideNode,設置單個節(jié)點的隱藏
【優(yōu)化】內置函數(shù)優(yōu)化:cancelHideNodes,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【新增】內置函數(shù)新增:cancelHideNode,設置單個節(jié)點的取消隱藏
【優(yōu)化】內置函數(shù)優(yōu)化:getHideNodesParam,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組。
【優(yōu)化】內置函數(shù)優(yōu)化:chooseDataInit,現(xiàn)支持傳入單個數(shù)據、帶分隔符的字符串、數(shù)組、二維數(shù)組(多級復選框)。
【新增】基礎方法新增:getCheckbarJsonArrParam,獲取基于返回參數(shù)的樹的復選框參數(shù),選中數(shù)據橫向存儲
【新增】基礎方法新增:beforeSend,異步加載發(fā)送ajax請求之前的回調
【新增】基礎方法新增:serialize,序列化json對象
【優(yōu)化】基礎方法優(yōu)化:success方法,新增一個入參,表示是否第一次渲染數(shù)據,并支持在增量加載時,加載子節(jié)點時也可以回調該方法。
【優(yōu)化】基礎方法優(yōu)化:done方法,新增一個入參,表示是否第一次渲染數(shù)據,并支持在增量加載時,在加載子節(jié)點時也可以回調該方法。
【優(yōu)化】內置方法優(yōu)化:dataInit方法,僅支持一個節(jié)點改變背景色的優(yōu)化。
【優(yōu)化】內置方法優(yōu)化:init方法,入參新增一個異步加載完成后的回調函數(shù),內部使用。
【優(yōu)化】內置方法優(yōu)化:getChild方法,入參新增一個異步加載完成后的回調函數(shù),內部使用。
【優(yōu)化】異步加載優(yōu)化:使用data加載,也會出現(xiàn)load效果。
【優(yōu)化】toolbat模塊優(yōu)化:當設置dataFormat時,默認的增刪改數(shù)據中會出現(xiàn)dataFormat配置的元素,優(yōu)化之后僅獲取文字。
【優(yōu)化】select模塊優(yōu)化:自適應當前組件的位置,向上或向下展開樹。
【新增】基礎屬性新增:asyncLoad,異步加載初始加載層級樹組
【新增】基礎屬性新增:selectCardHeight,樹面板的高度
【新增】內置方法新增:loadTreeInit,初始化加載樹
【新增】內置方法新增:loadChildTreeInit,初始化加載子節(jié)點
【新增】內置方法新增:dataLoadTree,用data加載樹
【新增】內置方法新增:asyncLoadTree,異步加載樹
------------------------v2.5.6(2019/10/24)【新增】:------------------------
【修復】標簽屬性修復:ul標簽上data-value屬性設置無效的問題
【優(yōu)化】數(shù)據格式:獲取格式中的basicData和recordData將提前轉化為JSON格式,不在需要手動轉換。
【優(yōu)化】基礎方法優(yōu)化:render,支持加載下拉樹
【優(yōu)化】基礎方法優(yōu)化:reload,支持重載下拉樹
【新增】基礎屬性新增:bak,內置屬性,備份Html。
【新增】事件監(jiān)聽:changeSelect,下拉樹面板開閉狀態(tài)改變后,觸發(fā)事件。
【新增】內置方法新增:rollbackHtml,基于備份的Html數(shù)據回滾
【新增】內置方法新增:setDisabledAllNodes,設置全部節(jié)點為disabled
【新增】內置方法新增:reloadSelectSetting,重新設置下拉樹的基本參數(shù)
【新增】內置方法新增:reloadSelectDom,重新渲染下拉樹的Dom結構
【新增】內置方法新增:selectCheckboxVal,設置復選框模式中的下拉樹的值
【新增】內置方法新增:getCheckbarJsonArrParam,獲取基于返回參數(shù)的樹的復選框參數(shù)數(shù)組
【新增】內置方法新增:checkAllNode,復選框全選
【新增】內置方法新增:cancelCheckedNode,取消全部復選框選中
【新增】內置方法新增:invertCheckedNode,反選復選框
【新增】內置方法新增:removeCheckedNode,刪除選中節(jié)點
------------------------v2.5.5(2019/10/12)【新增】:------------------------
【修復】內置方法修復:partialRefreshEdit,支持修改parentId后及時返顯到下掛節(jié)點
【優(yōu)化】單頁模式中樹的緩存問題
【優(yōu)化】基礎屬性優(yōu)化,開啟line時,toolbar的fixed顯示不正常
【優(yōu)化】基礎屬性優(yōu)化,開啟line時,div選中
懸停背景對齊
【優(yōu)化】基礎方法優(yōu)化:success方法的放置位置,可以將不同的數(shù)據格式在success方法內做轉換,或添加根節(jié)點。
【優(yōu)化】iframe模塊優(yōu)化:將原來用iframe包住的屬性提出,撤銷iframe這一層。
【優(yōu)化】內置屬性優(yōu)化:scroll屬性更名為scroll。
【優(yōu)化】內置方法優(yōu)化:當異步加載出現(xiàn)異常時,以文字形式而非彈框形式提示。
【新增】標簽屬性新增:ul標簽上新增data-value屬性,用于指定下拉樹的初始展示值
【新增】基礎屬性新增:width,設置樹的寬度
【新增】基礎屬性新增:select,設置樹模式為下拉樹
【新增】基礎屬性新增:selectTips,設置下拉樹時的輸入框提示文字
【新增】基礎屬性新增:selectInputName,設置下拉樹內部表單標簽的name
【新增】基礎屬性新增:withCredentials,用于開啟生成跨域的XHR對象,設置后可指定同源session,默認false。
【新增】基礎方法新增:set,可以增加同一次引用中,dtree的公共屬性指定,所有基礎屬性都可以指定。
【新增】基礎方法新增:renderSelect,初始化下拉樹
【新增】基礎方法新增:selectVal,設置下拉樹的初始展示值
【新增】內置方法新增:selectVal,設置下拉樹的初始展示值
【新增】內置方法新增:selectSetting,設置下拉樹的初始元素
【新增】內置方法新增:renderSelectDom,渲染下拉樹的Dom結構
【新增】內置方法新增:clickNodeCheckbar,點擊節(jié)點選中復選框
【更新】內置方法更新:getNoneDom方法,添加errText子方法,顯示錯誤信息。
------------------------v2.5.4(2019/6/14)【修復】:------------------------
【修復】內置方法中,使用data方法獲取值不到的問題。
【優(yōu)化】基礎屬性優(yōu)化:ficon,可以設置Array型數(shù)據,與icon的配置方式相同
【優(yōu)化】基礎屬性優(yōu)化:skin,其中設置layui看起來更像layui的風格,新增laySimple風格,遵從簡約版layui樹形菜單。
【優(yōu)化】內置方法優(yōu)化:涉及樣式的一系列內置方法優(yōu)化
【新增】基礎屬性新增:height,調整高度,與table用法一致
【新增】基礎屬性新增:response中新增ficonClass,可以指定一級圖標樣式。
【新增】內置方法新增:cancelNavThis,取消選中div。
【更新】內置方法更新:parseData:增加對ficonClass屬性的解析
【更新】內置方法更新:changeCheck,可以通過傳遞參數(shù)的方式傳遞復選框dom。
【移除】基礎屬性移除:dot,移除一級圖標小圓點的單獨設置,改為在ficon中配置,與icon的配置方式相同
【移除】基礎屬性移除:firstIconArray,與nodeIconArray合并。
------------------------v2.5.0(2019/6/01)【適配】:------------------------
【適配】對layui2.5適配
【修復】內置屬性修復,error方法,現(xiàn)在可以正確的獲取參數(shù)列表中的參數(shù),如無定義則默認打印textStatus。
【修復】內置屬性修復,complete方法,現(xiàn)在可以正確的獲取參數(shù)列表中的參數(shù)
【新增】內置屬性新增:line,用于指定樹線
【新增】內置方法新增:showLine:用于顯示樹線
【新增】內置方法新增:showLineLi:作用在單個LI顯示樹線
------------------------v2.5.0(2019/5/20)【大版本】:------------------------
【大改】數(shù)據格式:reponse中isLast屬性更換為last屬性。
【大改】數(shù)據格式:reponse中isChecked屬性更換為checked屬性。
【大改】數(shù)據格式:defaultRequest中isLeaf屬性更換為leaf屬性。
【大改】數(shù)據格式:defaultRequest中isChecked屬性更換為checked屬性。
【大改】內置屬性:record開啟后,原來記錄節(jié)點的全部數(shù)據(排除children和basicData)改為只記錄用戶自定義的數(shù)據(同樣排除children和basicData)
【修復】toolbar模塊修復:自定義的toolbar的回調函數(shù)的第二個$div參數(shù)修復,現(xiàn)在可以取到值
【修復】toolbar模塊修復:內置函數(shù):changeTreeNodeEdit中的title未定義的問題。
【修復】menubar模塊修復:將dtree放在form中,menubar的默認按鈕單擊之后會提交表單的問題。
【修復】iframe模塊修復:配置了iframeDefaultRequest時,只會顯示iframeDefaultRequest中的參數(shù)的問題。
【優(yōu)化】toolbar模塊優(yōu)化:內置的三個按鈕中的label均加上title提示
【優(yōu)化】基礎方法優(yōu)化:render方法和reload方法中,如果樹在當前頁面中被加載過一次了,再次加載會從緩存中取出樹,并將樹上次點擊的節(jié)點作為參數(shù)記錄下載,現(xiàn)在優(yōu)化為還是從緩存中取,但是會重置上次記錄的參數(shù)。
【優(yōu)化】內置函數(shù)優(yōu)化:getLiItemDom
當parentId為0時組件自動判定為false從而使用內置parentId的問題。
【新增】基礎屬性新增:iconfont屬性,用于定義使用圖標數(shù)組或string
【新增】基礎屬性新增:iconfontStyle屬性,用于自定義樹的每個關鍵部位使用的圖標
【新增】基礎屬性新增:accordion屬性,用于開啟手風琴模式
【新增】基礎屬性新增:contentType屬性,用于可以顯示配置發(fā)送信息至服務器時內容編碼類型
【新增】基礎屬性新增:response屬性中新增disabled,標識節(jié)點禁用。
【新增】基礎屬性新增:response屬性中新增isHide,標識節(jié)點隱藏。
【新增】基礎屬性新增:formatter屬性,用于對樹展示節(jié)點的文字信息格式化處理。
【新增】基礎屬性新增:errDataShow屬性,標識是否在遞歸數(shù)據出現(xiàn)錯誤后,顯示錯誤信息。
【新增】基礎屬性新增:none,用于定于樹初始化未加載節(jié)點時的提示文字。
【新增】基礎屬性新增:error:用于異步加載中出現(xiàn)異常時的用戶自定義函數(shù)。
【新增】基礎屬性新增:errDataShow屬性,標識是否在遞歸數(shù)據出現(xiàn)錯誤后,顯示錯誤信息。
【新增】基礎屬性新增:drawable屬性,用于開啟拖拽。
【新增】基礎方法新增:getParam:
獲取指定節(jié)點選中值
【新增】基礎方法新增:getAllParentParam: 獲取指定節(jié)點的全部上級節(jié)點
【新增】基礎方法新增:initNoAllCheck: 復選框半選狀態(tài)初始化設置
【新增】基礎方法新增:initAllCheck: 復選框選中狀態(tài)初始化設置
【新增】基礎方法新增:click:模擬單擊事件
【新增】checkbar模塊新增:checkbarData新增屬性:"halfChoose",用于記錄選中和半選中的數(shù)據
【新增】menubar模塊新增:menubar內置新增三個默認方法:checkAll:全選,unCheckAll:全不選,invertAll:反選
【新增】toolbar模塊新增:toolbar內置新增兩個默認方法:pulldown:展開當前節(jié)點下的全部節(jié)點,pullup:收縮當前節(jié)點下的全部節(jié)點
【新增】toolbar模塊新增:toolbar新增屬性:toolbarWay,工具欄顯示方式,contextmenu:右鍵,follow:跟隨節(jié)點,fixed:固定在節(jié)點右側
【新增】toolbar模塊新增:toolbarBtn中新增一系列的屬性(id、placeholder、verify、defElem、readonly、disabled、filter)
【新增】toolbar模塊新增:toolbarBtn中,optionsData支持使用function回調
【新增】內置屬性新增:errNode屬性,記錄在渲染節(jié)點時有問題的數(shù)據。
【新增】內置屬性新增:usefontStyle屬性,用于最終指定樹的每個關鍵部位使用的圖標
【新增】內置方法新增:replaceDom:替換節(jié)點的dom值,或指定值。
【新增】內置方法新增:partialRefreshAdd:局部刷新樹--當前節(jié)點新增子節(jié)點時
【新增】內置方法新增:partialRefreshEdit:局部刷新樹--當前節(jié)點選中時
【新增】內置方法新增:partialRefreshDel:局部刷新樹--當前節(jié)點選中被刪除時
【新增】內置方法新增:ensureTheme:確認最終主題。
【新增】內置方法新增:useDefaultOrUserDefineFnodeStyle:賦值一級圖標
【新增】內置方法新增:useDefaultOrUserDefineSnodeStyle:賦值二級圖標
【新增】內置方法新增:useDefaultOrUserDefineCheckboxStyle:賦值復選框圖標
【新增】內置方法新增:useDefaultOrUserDefineMenubarStyle:賦值菜單欄圖標
【新增】內置方法新增:useDefaultOrUserDefineMenubarExtStyle:賦值擴展菜單欄圖標
【新增】內置方法新增:useDefaultOrUserDefineToolbarStyle:賦值擴展菜單欄圖標
【新增】內置方法新增:useDefaultOrUserDefineToolbarExtStyle:賦值擴展工具欄圖標
【新增】內置方法新增:operateIcon:
設置圖標的展開關閉,以及展開時/關閉時是最后一級圖標的處理
【新增】內置方法新增:msgErrNode: 判斷在數(shù)據加載時是否存在錯誤數(shù)據,并是否打印錯誤數(shù)據
【新增】內置方法新增:getParam: 獲取指定節(jié)點選中值
【新增】內置方法新增:getAllParentParam: 獲取指定節(jié)點的全部上級節(jié)點
【新增】內置方法新增:getNodeDom: 根據具體的id獲取基于當前id的div以及對應的其他dom元素
【新增】內置方法新增:getNode: 獲取指定節(jié)點Div
【新增】內置方法新增:accordionUL: 開啟手風琴模式時對其他節(jié)點的處理
【新增】內置方法新增:setDisabledNodes: 設置節(jié)點為disabled
【新增】內置方法新增:cancelDisabledNodes:將節(jié)點的disabled取消
【新增】內置方法新增:getDisabledNodesParam: 獲取指定disabled節(jié)點的值
【新增】內置方法新增:getAllDisabledNodesParam: 獲取全部disabled節(jié)點的值
【新增】內置方法新增:setHideNodes: 設置節(jié)點為hide
【新增】內置方法新增:cancelHideNodes: 將節(jié)點的hide取消
【新增】內置方法新增:getHideNodesParam: 獲取指定hide節(jié)點的值
【新增】內置方法新增:getAllHideNodesParam: 獲取全部hide節(jié)點的值
【新增】內置方法新增:toolbarHide:隱藏toolbar
【新增】內置方法新增:toolbarMethod:toolbar內置方法
【新增】內置方法新增:toolbarListener:toolbar內置監(jiān)聽
【新增】內置方法新增:getNowNodeOrNull:獲取當前選中div,沒有選中則為null
【新增】內置方法新增:navThis:選中div
【新增】內置方法新增:getNoneDom:當無節(jié)點數(shù)據時顯示dom信息
【新增】內置方法新增:dynamicToolbarDom:在節(jié)點后動態(tài)綁定fixed和follow條件的工具欄
【更新】內置方法更新:setToolbarDom,設置工具欄按鈕,現(xiàn)在區(qū)別開來哪種toolbar的創(chuàng)建方式
【更新】內置方法更新:changeTreeNodeAdd新增一個回傳參數(shù):refresh,用于新增完成后,局部刷新
【更新】內置方法更新:parseData新增一個回傳參數(shù):fmtTitle,用于獲取formatter標記過的內容,原來的title函數(shù)只獲取原始title信息
v2.4.5_finally(2018/12/22)【修復】:
1.【修復】單頁應用中,未開始toolbar導致body上的所有事件失效。
2.【優(yōu)化】更新dist文件夾中的dtree壓縮
3.【優(yōu)化】toolbar模塊優(yōu)化:新增節(jié)點時,當開啟了record參數(shù)時不會將參數(shù)新增到節(jié)點上的問題。
v2.4.5_finally(2018/12/21)【優(yōu)化】:
1.【優(yōu)化】menubar模塊優(yōu)化:點擊收縮時,當前頁的所有樹都收縮的問題。
2.【優(yōu)化】menubar模塊優(yōu)化:點擊刪除復選框時,展開和收縮節(jié)點會報錯,現(xiàn)在改為刪除的節(jié)點如果有子集的話,子集會一并刪除,但是回調函數(shù)中只會提供你勾中的數(shù)據。
3.【優(yōu)化】基礎方法優(yōu)化:dataInit方法回顯數(shù)據時,當前選中的數(shù)據無法被獲取到的問題。
4.【優(yōu)化】基礎方法優(yōu)化:parseData方法的basicData()方法,basicData如果未指定,前端的該項屬性無數(shù)據,而不是""
5.【優(yōu)化】異步屬性優(yōu)化:使用data加載時,可以允許指定的data為[]。
6.【優(yōu)化】異步屬性優(yōu)化:使用data加載時,現(xiàn)在也有success和done的回調
7.【新增】checkbar模塊新增:checkbarType新增屬性:"only",用于模擬單選,只能同時選擇一個復選框。
8.【新增】異步回調方法新增:新增success回調,用于數(shù)據加載完畢后的回調,在done之前執(zhí)行
9.【新增】異步屬性新增:filterRequest屬性,用于過濾樹自動發(fā)起的請求中你不需要的參數(shù)。
10.【新增】基礎屬性新增:record屬性,開啟數(shù)據記錄模式,用于記錄用戶提供的JSON數(shù)據串中,指定當前節(jié)點的JSON數(shù)據(排除basicData字段和children字段)
11.【新增】基礎屬性新增:load屬性,是否開啟加載遮罩。
12.【新增】內置函數(shù)新增:getFilterRequestParam,獲取filterParam過濾后的requestParam
v2.4.5_finally_beta(2018/12/07)【大改】:
0.【新增】提供的內容中新增dist/dtree.js壓縮js文件。
1.【大改】css:css樣式均加上dtree前綴。
2.【大改】圖標:iconfont更改為dtreefont。
3.【大改】事件監(jiān)聽:圖標點擊事件返回的參數(shù)改為一個JSON對象,具體查看基礎文檔的事件監(jiān)聽。
4.【大改】事件監(jiān)聽:節(jié)點點擊事件返回的參數(shù)改為一個JSON對象,具體查看基礎文檔的事件監(jiān)聽。
5.【大改】事件監(jiān)聽:節(jié)點雙擊事件返回的參數(shù)改為一個JSON對象,具體查看基礎文檔的事件監(jiān)聽。
6.【大改】事件監(jiān)聽:復選框點擊事件返回的參數(shù)改為一個JSON對象,具體查看基礎文檔的事件監(jiān)聽。
7.【大改】事件監(jiān)聽:iframe加載完畢事件返回的參數(shù)改為一個JSON對象,具體查看基礎文檔的事件監(jiān)聽。
8.【新增】基礎方法新增:getChildParam,獲取全部下級節(jié)點
9.【新增】menubar模塊新增:menubarTips屬性,用于指定menubar的依附方式。
10.【新增】toolbar模塊新增:toolbarFun新增loadToolbarBefore函數(shù),用于呈現(xiàn)右鍵菜單之前調用的函數(shù)。
11.【新增】內置函數(shù)新增:initTreePlus
用于初始化菜單欄和工具欄的div。
12.【新增】內置函數(shù)新增:openTreePlus 用于開啟工具欄和菜單欄。
13.【新增】內置函數(shù)新增:getMenubarDom 用于獲取菜單欄。
14.【新增】內置函數(shù)新增:getExtMenubarDom 用于獲取擴展菜單欄。
15.【新增】內置函數(shù)新增:getMenubarToolDom 用于獲取依附在工具欄的菜單欄。
16.【新增】內置函數(shù)新增:getExtMenubarToolDom 用于獲取依附在工具欄的擴展菜單欄。
17.【新增】內置函數(shù)新增:menubarMethod 用于menubar內置調用方法。
17.【新增】內置函數(shù)新增:menubarListener 用于menubar內置監(jiān)聽。
18.【新增】內置函數(shù)新增:setToolbarDom 用于設置工具欄按鈕。
19.【新增】內置函數(shù)新增:unbindBrowserEvent 用于解綁瀏覽器事件。
19.【新增】內置屬性新增:response屬性中新增spread。
20.【優(yōu)化】優(yōu)化了圖標顯示。
21.【優(yōu)化】toolbar模塊:單頁應用中,右鍵菜單的顯示位置問題。
22.【優(yōu)化】menubar模塊:在開啟了toolbar模塊時按鈕點擊失效的問題。
23.【優(yōu)化】iframe模塊:iframeuUrl指定了"?"時,實際發(fā)送的url會出現(xiàn)兩個"?"的問題。
23.【優(yōu)化】數(shù)據格式:默認數(shù)據格式中非必須指定isLast屬性,移除level屬性的作用。
24.【修復】數(shù)據格式:在開啟了list風格參數(shù)時,修復必須指定isLast返回的問題和設置initLevel無效的問題。
25.【修復】toolbar模塊:新增節(jié)點返回json格式后顯示數(shù)據未定義的問題。
26.【移除】內置函數(shù)移除:refreshTree,現(xiàn)放置在menubarMethod方法中。
27.【移除】內置函數(shù)移除:openAllNode,現(xiàn)放置在menubarMethod方法中。
28.【移除】內置函數(shù)移除:closeAllNode,現(xiàn)放置在menubarMethod方法中。
28.【移除】內置函數(shù)移除:loadChildTree。
29.【移除】內置函數(shù)移除:openMenubar。
30.【移除】內置函數(shù)移除:openToolbar。
31.【移除】內置屬性移除:level。
32.【移除】內置屬性移除:response屬性中移除level。
v2.4.5(2018/11/30)【修復】:
1.【修復】基礎方法修復:dataInit方法的返回數(shù)據異常。
2.【修復】基礎方法修復:render函數(shù)自動識別是否重載樹,代碼再次修復(針對單頁應用)。
3.【新增】內置函數(shù)新增:refreshTree,用于刷新樹。
4.【新增】內置函數(shù)新增:parseData
用于解析數(shù)據。
5.【優(yōu)化】checkbar模塊:checkArr屬性支持傳遞字符串。
6.【修復】toolbar模塊:拼接新增節(jié)點內容的代碼異常 。
v2.4.5(2018/11/25)【修復】:
1.【修復】render函數(shù)自動識別是否重載樹,代碼修復。
2.【修復】內部代碼bug。
3.【優(yōu)化】修改了右鍵菜單彈出的動畫效果。
v2.4.5(2018/11/25)【優(yōu)化】:
1.【優(yōu)化】優(yōu)化了圖標顯示。
2.【新增】內置圖標新增。
3.【新增】ficon屬性:用于用戶自定義一級圖標
4.【新增】firstIconArray屬性:用于用戶自定義擴展一級圖標
5.【新增】異步加載模塊添加headers屬性。
6.【新增】toolbar模塊:新增屬性toolbarExt,用于自定義擴展工具欄右鍵菜單按鈕
7.【新增】checkbar模塊:新增checkbarFun中的回調方法:chooseBefore,用于復選框點擊前回調
8.【新增】內置函數(shù)新增:changeCheck,用于改變復選框狀態(tài)。
9.【優(yōu)化】render函數(shù)自動識別是否重載樹。
10.【優(yōu)化】內部代碼優(yōu)化。
11.【更新】更新了幫助文檔。
v2.4.5(2018/11/23)【修復】:
1.【修復】toolbar模塊點擊刪除按鈕時,控制臺報錯。
2.【修復】配置了dot:false時,toolbar模塊新增節(jié)點后一級圖標不顯示的問題。
3.【修復】內置函數(shù)優(yōu)化:initNoAllCheck,修復了顯示bug
4.【新增】內置函數(shù)新增:initAllCheck,復選框選中狀態(tài)初始化設置
5.【新增】內置函數(shù)新增:checkStatus,設置復選框選中/未選中/半選
6.【優(yōu)化】toolbar模塊:點擊刪除時,當刪除了某個節(jié)點下的最后一個子節(jié)點,那該節(jié)點也會改變樣式變成葉子節(jié)點。
7.【優(yōu)化】toolbar模塊:addTreeNode方法優(yōu)化,ajax請求不限于同步,方法無需返回
8.【新增】內置函數(shù)新增:changeTreeNodeAdd,新增節(jié)點后改變節(jié)點內容
9.【優(yōu)化】toolbar模塊:editTreeNode方法優(yōu)化,ajax請求不限于同步,方法無需返回
10.【新增】內置函數(shù)新增:changeTreeNodeEdit,編輯節(jié)點后改變節(jié)點內容
11.【優(yōu)化】toolbar模塊:delTreeNode方法優(yōu)化,ajax請求不限于同步,方法無需返回
12.【新增】內置函數(shù)新增:changeTreeNodeDel,刪除節(jié)點后改變節(jié)點內容
13.【優(yōu)化】toolbar模塊:editTreeLoad方法優(yōu)化,ajax請求不限于同步,方法無需返回
14.【新增】內置函數(shù)新增:changeTreeNodeDone,編輯頁打開后顯示編輯頁內容
15.【更新】更新了幫助文檔
v2.4.5(2018/11/22)【修復】【新增】:
1.【修復】樹重載時,使用data屬性會造成數(shù)據重復加載問題。
2.【修復】輸出參數(shù)的字段,spared修改為spread(之前單詞拼錯了。。。。)。
3.【新增】toolbar模塊中新增屬性:toolbarStyle,用于自定義toolbar的顯示文字,彈框大小。
4.【移除】基礎屬性中移除了addIndex屬性。
5.【新增】skin屬性:用于用戶自定義主題。
v2.4.5(2018/11/21)【修復】【新增】:
1.【修復】使用dataFormat屬性時,直接使用data屬性配置節(jié)點內容失效的問題。
2.【修復】parentId為null導致節(jié)點數(shù)據加載失效的問題。
3.【優(yōu)化】反選節(jié)點時將選中哪一級的節(jié)點展開,單選和多選均生效。
4.【新增】dot屬性,用于用戶自定義一級圖標中的小圓點是否顯示。
v2.4.5(2018/11/21)【優(yōu)化】【新增】:
1.【新增】toolbar取消按鈕的顯示,開始綁定右鍵點擊事件。
2.【新增】toolbar模塊新增一個屬性:toolbarScroll
用于綁定樹的上級div容器,讓樹可以顯示滾動條的div容器,右鍵菜單綁定必填項。
3.【新增】toolbar模塊新增編輯頁數(shù)據回顯功能。
4.【新增】樹加載完畢后的回調函數(shù)
5.【新增】dataStyle屬性,用于用戶配置layui通用的json數(shù)據風格
6.【新增】dataFormat屬性,用于用戶自定義data中的數(shù)據格式(即支持傳入一個大的list
7.更新文檔示例。
v2.4.5(2018/11/09)【優(yōu)化】:
1.【優(yōu)化】更新了圖標庫,精簡了圖標(60個)
v2.4.5(2018/11/09)【初始】:
1.【初始】基本樹形展示,無限級,支持自定義修改樹的展示圖標
2.【初始】支持異步/同步數(shù)據加載,支持靜態(tài)數(shù)據加載,支持數(shù)據緩存
3.【初始】支持自定義返回json格式,支持自定義異步/同步加載參數(shù)
4.【初始】支持復選框,1-N級,支持復選框的四種選中形式,支持記錄復選框選中/更改數(shù)據的回調
5.【初始】支持工具欄,即可直接修改當前樹節(jié)點,新增/
編輯/刪除等
6.【初始】支持菜單欄,即可直接對樹進行全部節(jié)點展開/收縮、刪除全部選中節(jié)點、刷新樹、搜索樹等
7.【初始】支持加載iframe,即點擊樹節(jié)點時,可以帶上一個訪問iframe的url,這個設計在左樹右內容風格的頁面極為有用
8.【初始】支持數(shù)據回調,單擊節(jié)點回調、雙擊節(jié)點回調、復選框選中回調、iframe加載完畢回調等
9.【初始】支持數(shù)據獲取,即獲取當前選中節(jié)點數(shù)據,當前選中復選框節(jié)點數(shù)據等
10.【初始】支持數(shù)據反顯,即加載樹之后將需要反顯的節(jié)點高亮顯示或選中
目錄結構:
├─layui /layui 基礎框架
│─layui_exts //存放第三方組件的目錄
└─dist/ 組件的壓縮后的js存在的地方
└─dtree/ 組件模塊名
├─dtree.js //組件核心 JS
├─font //組件核心圖標庫,庫中攜帶了dtreefont.css文件,在使用樹時需要引入該文件
└─dtree.css //組件 CSS 庫
使用方式:
將壓縮包解壓后放置在項目的任意路徑,根據layui引入模塊的方式將dtree.js文件引入即可使用;
在頁面中,使用組件則需要引入兩個class:
layui_exts/dtree/dtree.css
layui_exts/dtree/font/dtreefont.css
簡單url加載示例(更多示例請查看文檔):
// html代碼
<ul id="demoTree1" class="dtree" data-id="0"></ul>
// js代碼
layui.config({
base: '../js/layui_exts/dtree/' //配置 layui 第三方擴展組件存放的基礎目錄
}).extend({
dtree: 'dtree' //定義該組件模塊名
}).use(['element','layer', 'dtree'], function(){
var layer = layui.layer,
dtree = layui.dtree,
$ = layui.$;
dtree.render({
elem: "#demoTree1", //綁定元素
url: "../json/case/demoTree1.json" //異步接口
});
//單擊節(jié)點 監(jiān)聽事件
dtree.on("node('demoTree1')" ,function(param){
layer.msg(JSON.stringify(param));
});
});
//部分結果展示
// 異步數(shù)據示例,使用url屬性時返回內容,其中
//checkArr:該字段是作為開啟復選框后的必填項,如無,則復選框不顯示
//basicData: 該字段是作為用戶自定義節(jié)點內容時的字段,如不需要自定義節(jié)點內容的話,可以無該字段
{
"status":{"code":200,"message":"操作成功"},
"data":[{
"id":"001",
"title": "湖南省",
"isLast": false,
"level": "1",
"parentId": "0",
"checkArr": [{"type": "0", "isChecked": "0"}],
"basicData": {"data1": "自定義數(shù)據111", "data2": "自定義數(shù)據222", "data3": "自定義'我?guī)Я藛我?#39;333"},
"children":[{
"id":"001001",
"title": "長沙市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001002",
"title": "株洲市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001003",
"title": "湘潭市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001004",
"title": "衡陽市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001005",
"title": "郴州市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"002",
"title": "湖北省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"002001",
"title": "武漢市",
"isLast":true,
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002002",
"title": "黃岡市",
"checkArr": [{"type": "0", "isChecked": "0"}],
"isLast":true,
"parentId": "002",
"level": "2"
},{
"id":"002003",
"title": "潛江市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002004",
"title": "荊州市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002005",
"title": "襄陽市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"003",
"title": "廣東省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"003001",
"title": "廣州市",
"isLast":false,
"parentId": "003",
"level": "2",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"003001001",
"title": "天河區(qū)",
"isLast":true,
"parentId": "003001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "3"
},{
"id":"003001002",
"title": "花都區(qū)",
"isLast":true,
"parentId": "003001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "3"
}]
},{
"id":"003002",
"title": "深圳市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003003",
"title": "中山市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003004",
"title": "東莞市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003005",
"title": "珠海市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003006",
"title": "韶關市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"004",
"title": "浙江省",
"isLast": false,
"level": "1",
"parentId": "0",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"004001",
"title": "杭州市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004002",
"title": "溫州市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004003",
"title": "紹興市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004004",
"title": "金華市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004005",
"title": "義烏市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"005",
"title": "福建省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"005001",
"title": "廈門市",
"isLast":true,
"parentId": "005",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
}]
}
簡單data加載示例(更多示例請查看文檔):
// html代碼
<ul id="demoTree1" class="dtree" data-id="0"></ul>
// js代碼
layui.config({
base: '../js/layui_exts/dtree' //配置 layui 第三方擴展組件存放的基礎目錄
}).extend({
dtree: 'dtree' //定義該組件模塊名
}).use(['element','layer', 'dtree'], function(){
var layer = layui.layer,
dtree = layui.dtree,
$ = layui.$;
dtree.render({
elem: "#demoTree1", //綁定元素
data: demoData //數(shù)據
});
//單擊節(jié)點 監(jiān)聽事件
dtree.on("node('demoTree1')" ,function(param){
layer.msg(JSON.stringify(param));
});
});
//部分結果展示
// data數(shù)據示例,其中
//checkArr:該字段是作為開啟復選框后的必填項,如無,則復選框不顯示
//basicData: 該字段是作為用戶自定義節(jié)點內容時的字段,如不需要自定義節(jié)點內容的話,可以無該字段
var demoData = [{
"id":"001",
"title": "湖南省",
"isLast": false,
"level": "1",
"parentId": "0",
"checkArr": [{"type": "0", "isChecked": "0"}],
"basicData": {"data1": "自定義數(shù)據111", "data2": "自定義數(shù)據222", "data3": "自定義'我?guī)Я藛我?#39;333"},
"children":[{
"id":"001001",
"title": "長沙市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001002",
"title": "株洲市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001003",
"title": "湘潭市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001004",
"title": "衡陽市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"001005",
"title": "郴州市",
"isLast":true,
"parentId": "001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"002",
"title": "湖北省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"002001",
"title": "武漢市",
"isLast":true,
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002002",
"title": "黃岡市",
"checkArr": [{"type": "0", "isChecked": "0"}],
"isLast":true,
"parentId": "002",
"level": "2"
},{
"id":"002003",
"title": "潛江市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002004",
"title": "荊州市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"002005",
"title": "襄陽市",
"isLast":true,
"parentId": "002",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"003",
"title": "廣東省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"003001",
"title": "廣州市",
"isLast":false,
"parentId": "003",
"level": "2",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"003001001",
"title": "天河區(qū)",
"isLast":true,
"parentId": "003001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "3"
},{
"id":"003001002",
"title": "花都區(qū)",
"isLast":true,
"parentId": "003001",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "3"
}]
},{
"id":"003002",
"title": "深圳市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003003",
"title": "中山市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003004",
"title": "東莞市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003005",
"title": "珠海市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"003006",
"title": "韶關市",
"isLast":true,
"parentId": "003",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"004",
"title": "浙江省",
"isLast": false,
"level": "1",
"parentId": "0",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"004001",
"title": "杭州市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004002",
"title": "溫州市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004003",
"title": "紹興市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004004",
"title": "金華市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
},{
"id":"004005",
"title": "義烏市",
"isLast":true,
"parentId": "004",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
},{
"id":"005",
"title": "福建省",
"isLast": false,
"parentId": "0",
"level": "1",
"checkArr": [{"type": "0", "isChecked": "0"}],
"children":[{
"id":"005001",
"title": "廈門市",
"isLast":true,
"parentId": "005",
"checkArr": [{"type": "0", "isChecked": "0"}],
"level": "2"
}]
}];