先上效果圖:
前言:element 樹形表在懶加載模式下官方沒有提供實時局部刷新節點的方法,在網上看了好多博客也沒有比較好的辦法
我能想到最直接的辦法就是讀源碼了,在差不多三小時的源碼瀏覽后終於在tree.js中找到懶加載關鍵的一個方法:
element 在每次更新節點時都調用了該方法,其中的load方法就是我們綁定的懶加載方法;最終發現它實現節點更新的關鍵在於:
於是寫一個更新某個節點的子節點的方法: 在增加和刪除后更新該節點的父節點(調用以上方法)即可
關鍵代碼其實就是兩步:
第一步:定義懶加載樹表的ref屬性 ref = "table"
第二步:重新加載,增加和刪除后更新該節點的父節點 如下:
this.$set(this$.refs.table.store.states.lazyTreeNodeMap,id,res.data)
// id為該節點的父節點id即為要刷新節點的id res.data為要刷新節點的數據