ElementUI tree控件如何取得被選中的節(jié)點，以及父節(jié)點（即使沒被全選）

tree綁定的數(shù)據(jù)是一個list,經(jīng)過下面的函數(shù)computed出來的,保存的時候,我從這個list里面去拿的parentId

 function toTree(data, parent_id) {
    var tree = [];
    var temp;
    for (var i = 0; i < data.length; i++) {
      if (data[i].parentId == parent_id) {
        var obj = data[i];
        temp = toTree(data, data[i].id);
        if (temp.length > 0) {
          obj.children = temp;
        }
        tree.push(obj);
      }
    }
    return tree;
  }
      

我自己獲取是這么寫的

getPermissions() {
        let _this=this;
        let permissions=this.$refs.tree.getCheckedKeys();
        let ids=[];
        permissions.forEach(key=>{
          getParentId(key)
        })
        function getParentId(id) {
            let node=_this.list.find(item=>item.id==id)
            if(node.parentId==0){
              return
            }else{
              ids.push(node.parentId)
              getParentId(node.parentId)
            }
        }
        permissions=[...new Set([...permissions,...ids])]
        return permissions.join(',')
      },

今天遇見了同樣的問題 運用的也是改源碼的方法
官方給了兩個方法 getCheckedNodes 和 getSelectedNodes 沒有獲取父級的
所以就自己新增了個方法 getCheckedAll 獲取選中和父級的


getCheckedAll:function(){

 return this.flatState.filter(function (e) {
    if(e.node.indeterminate){
        return e.node.indeterminate
    }
    return e.node.checked
}).map(function (e) {
    return e.node
})

}

打印e會很容易的看見 官方有標識的 套用之前的getCheckedNodes 的代碼一下就能寫出來最后再
this.$refs.tree.getCheckedAll() 就能獲取了父級的對象了

可以和后臺寫上id可以根據(jù)層級進行傳遞
比如使用-進行連接

祖父級id-父級id-id-子集id

官方v2.2.1版本已經(jīng)提供獲取半選中狀態(tài)節(jié)點對象。

具體實現(xiàn)思路：

// 1. 先合并選中／半選中節(jié)點Id，請求傳給后臺。
[].concat(this.$refs.menuListTree.getCheckedKeys(), [this.tempKey], this.$refs.menuListTree.getHalfCheckedKeys())

this.tempKey === -666666 // 臨時key, 用于解決tree半選中狀態(tài)項不能傳給后臺接口問題. # 待優(yōu)化

// 2. 給tree綁定數(shù)據(jù)時，通過tempKey移除之前添加的半選中狀態(tài)節(jié)點Id。
var idx = this.menuIdList.indexOf(this.tempKey)
if (idx !== -1) {
  this.menuIdList.splice(idx, this.menuIdList.length - idx)
}
this.$refs.menuListTree.setCheckedKeys(this.menuIdList)

詳細實現(xiàn)代碼，可在https://github.com/daxiongYan...查閱。

將tree控件的數(shù)據(jù)源在取下來之后變換一下，遍歷treeSource 為每個node節(jié)點增加屬性parentIds:"id1,id2,..."

我也是這個問題 準備直接改源碼。你解決了么

我有一個思路，我也親測過，可以取得父節(jié)點id
一般返回來的子節(jié)點數(shù)據(jù)data中存有父id（parent_id）,通過element 的getCheckedNodes方法可以獲得選中節(jié)點就可以獲得父id了。多簡單

treeNodes = this.$refs.tree.getCheckedNodes(true);
treeKeys = this.$refs.tree.getCheckedKeys();

/**

子節(jié)點id
*/
for(var i = 0; i < treeKeys.length - 1; i++) {

ids[i] = treeKeys[i];
}
/**

選中子節(jié)點的父節(jié)點id
*/
for(var i = 0; i < treeNodes.length; i++) {

ids.push(treeNodes[i].parent_id);
}
ids = JSON.stringify(ids);

改源碼不太好，所以我用了笨辦法，
思路就是拿到選中的code 后 ，遍歷 整棵樹， 然后把半選中的添加進去，編輯的時候去掉這些半選中的nodes

//同步樹插件的半選中狀態(tài)（參數(shù)： 樹的data,選中的node列表，是添加還是刪除，選中節(jié)點的關鍵字key，如果是null 就取整個node）
export const handleUpdateCheckds = (tree, checkeds, isAdd = true, checkKey = 'no') => {
    let findHalfCheckds = (item, checkeds, result = new Set()) => {
        if (item.children) {
            let node = [...item.children];
            while (node.length) {
                let data = node.shift();
                if (!item.isRoot) {
                    if (isAdd && checkeds.includes(data[checkKey] || data) && !checkeds.includes(item[checkKey] || item)) {
                        result.add(item[checkKey] || item);
                    } else if (!isAdd && !checkeds.includes(data[checkKey] || data) && checkeds.includes(item[checkKey] || item)) {
                        result.add(item[checkKey] || item);
                    }
                }
                if (data.children && data.children.length > 0) {
                    node = node.concat(data.children);
                }
                findHalfCheckds(data, checkeds, result);
            }
        }
        return result;
    };
    let result,
        halfCheckds = [...findHalfCheckds({
            isRoot: true,
            children: tree
        }, checkeds)];
    if (isAdd) {  //
        result = [...new Set(checkeds.concat(halfCheckds))];
    } else {
        result = checkeds.filter(item => !halfCheckds.includes(item));
    }
    //console.log(halfCheckds);
    return result;
};

終于解決了
你找到node_modules/element-ui/lib/element-ui.common.js
在20106行 改if(node.checked)為if(node.checked||node.indeterminate)就可以了

請問下，如何根據(jù)已有的選擇的key，復原原來的選擇，如果通過修改源碼的方式設置以后，那份獲取到的key的數(shù)據(jù)直接set應該是不對的- -