鍍金池/ 問答/HTML/ element UI 樹控件 懶加載狀態(tài)、對(duì)樹增刪改操作后,如何更新?

element UI 樹控件 懶加載狀態(tài)、對(duì)樹增刪改操作后,如何更新?

在用 element UI 的樹形控件(el-tree),采用懶加載(lazy + :load="loadNode"方法 )形式,業(yè)務(wù)是:
1-新增一級(jí)節(jié)點(diǎn)
2-任何節(jié)點(diǎn)可新增子節(jié)點(diǎn)
3-編輯節(jié)點(diǎn)
4-刪除節(jié)點(diǎn)
---------( 遇到的問題 )------------
1-新增一級(jí)節(jié)點(diǎn),采用 “insertAfter” 無法使用

bus.$on("adddd", function(nc){
  console.log("ssssssssssssssssss")
  console.log(nc)
  console.log(_this.lastOne)
  _this.$refs.tree.insertAfter(nc, _this.lastOne);
})

nc是“newChild”新增(一級(jí))節(jié)點(diǎn)、(請看 console打?。?br>this.lastOne是一級(jí)目錄最后一個(gè)節(jié)點(diǎn)“1111”的data(請看 console打印、截圖紅框)
clipboard.png

代碼運(yùn)行起來后,報(bào)錯(cuò)如下:
clipboard.png

點(diǎn)擊第一行 at Node.insertChild (element-ui.common.js?ccbf:22374),進(jìn)去(問題在-紅框處):
clipboard.png

2-新增節(jié)點(diǎn)后刷新異常:
a:父節(jié)點(diǎn)未展開(lazy-load)時(shí),新增無效:根本看不到新增節(jié)點(diǎn)、一旦展開(load)新讀取數(shù)據(jù)會(huì)覆蓋 --- (以下截圖 逐步演示)

第一步: F5 刷新完成:
clipboard.png

第二步,直接新增:
clipboard.png

(。。。看不出效果)
clipboard.png

第三步,點(diǎn)擊類目3的小三角、懶加載 子節(jié)點(diǎn)中并沒有之前新增的子節(jié)點(diǎn)(確認(rèn)原先新增子節(jié)點(diǎn)已被覆蓋)
clipboard.png

b:如果父節(jié)點(diǎn)之前已經(jīng)展開,則新增操作正常。

3-另外需要問的是:懶加載情況下、刷新節(jié)點(diǎn)問題(這個(gè)現(xiàn)在無解...)

回答
編輯回答
萢萢糖

咱倆的問題是一樣的 , 增刪改查的操作都是和后臺(tái)交互的,單純在前端修改應(yīng)該是不行的,我現(xiàn)在修改之后采用的是:load中有個(gè)resolve去操作,但是他的這個(gè)方法會(huì)隨著展開的節(jié)點(diǎn)改變this指向,還是不盡人意,說白了是缺少一個(gè)更新指定節(jié)點(diǎn)的api

2018年5月22日 07:22
編輯回答
淺淺

我也遇到這個(gè)問題了,也是用的1樓的方法,但加載的節(jié)點(diǎn)跑到根節(jié)點(diǎn)下面了
用updateKeyChildren

2017年7月5日 20:59