vue + element 樹形表 懶加載 添加、編輯、刪除時 刷新節點


先上效果圖:

 

 

 

 

前言:element 樹形表在懶加載模式下官方沒有提供實時局部刷新節點的方法,在網上看了好多博客也沒有比較好的辦法

我能想到最直接的辦法就是讀源碼了,在差不多三小時的源碼瀏覽后終於在tree.js中找到懶加載關鍵的一個方法:

 

 element 在每次更新節點時都調用了該方法,其中的load方法就是我們綁定的懶加載方法;最終發現它實現節點更新的關鍵在於:

 

 於是寫一個更新某個節點的子節點的方法:  在增加和刪除后更新該節點的父節點(調用以上方法)即可

 

 關鍵代碼其實就是兩步:

第一步:定義懶加載樹表的ref屬性   ref = "table"

第二步:重新加載,增加和刪除后更新該節點的父節點  如下:

this.$set(this$.refs.table.store.states.lazyTreeNodeMap,id,res.data)

   // id為該節點的父節點id即為要刷新節點的id     res.data為要刷新節點的數據


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM