改造layui-樹(tree)元件的新增、編輯、刪除操作(補充上一篇)

辣姐什麼鬼發表於2019-11-14

這篇是用來補充上一篇:改造layui-樹(tree)元件支援新增、編輯、刪除的自定義(彈框)操作(https://blog.csdn.net/liona_koukou/article/details/99824998)的,鑑於有同學問程式碼裡下面這兩個的詳細程式碼在此做一個樹操作的補充

limitNodeAddLevel: 0, // 設定第X級節點不允許新增操作
limitNodeDelLevel: 0, // 設定第X級節點不允許刪除操作

我們在layui官網見到的樹操作如下,每個節點後都有這三種操作:新增、編輯、刪除

但實際專案中可能會有這種情況出現:某級節點不允許新增或刪除操作

像我們這個專案就是根節點不允許刪除操作,3級節點不允許新增操作,為了實現這個功能我對layui的tree進行了修改

tree.js檔案修改如下:

1、預設配置里加上這兩項配置

2、節點操作圖示這裡加上判斷條件,如果設定這兩項那麼節點圖示內容做相應調整,預設是三種圖示都顯示(這部分程式碼是每一個節點渲染的時候都會進行判斷當前節點要顯示的操作有哪些),注意裡面的item.rank,這個rank是樹的資料結構裡我們後臺傳過來的,表示節點的等級是幾級節點,這樣可以自定義自己需要的樹操作限制。

3、tree元件使用:設定需要限制操作的節點等級就可以

以上o(* ̄︶ ̄*)o

 

相關文章