el-tree隻能勾選已選同層

最近有個需求，樹結構選項，如果有已勾選節點了，後續隻能勾選同一層級節點資料。

感覺可以記錄下。

實作思路：

1.同一層級的上一節點(父節點)肯定是相同的。是以判斷目前勾選的節點的父節點是否相同

2.如果沒有已選節點則可以随意勾選節點

orgNodeChange(node,check,childCheck){
      this.selectOrgList = [];
      this.charForm.orgIds = [];
      let checkedArr = this.$refs.orgTreeRef.getCheckedNodes();
      let checkedKeys = this.$refs.orgTreeRef.getCheckedKeys();
      if(check){
        if(checkedArr.length>1){
          for(let i=0;i<checkedArr.length;i++){
            /*
            在已選節點中(包含最後次勾選不在原先同層節點的資料)判斷目前勾選的節點是否跟原先的節點同層
            */
            if(node.dataId != checkedArr[i].dataId){
              this.lastTreeParentId = checkedArr[i].parentId;
            }
          }
          if(node.parentId != this.lastTreeParentId){
            this.$message.warning("選擇的節點不在同一層級請重新選擇");
            //移除已選中的并且不在同一層的節點
            this.$refs.orgTreeRef.setChecked(node.dataId,false,false);
            return;
          }else{
            this.selectOrgList = this.$refs.orgTreeRef.getCheckedNodes();
            this.charForm.orgIds = this.$refs.orgTreeRef.getCheckedKeys();
          }
        }else{
          this.selectOrgList = this.$refs.orgTreeRef.getCheckedNodes();
          this.charForm.orgIds = this.$refs.orgTreeRef.getCheckedKeys();
        }
      }else{
        if(checkedArr.length == 0){
          this.lastTreeParentId = null;
        }else{
          this.selectOrgList = this.$refs.orgTreeRef.getCheckedNodes();
          this.charForm.orgIds = this.$refs.orgTreeRef.getCheckedKeys();
        }
      }
    },
           

1.每次勾選節點時，都先擷取已勾選的

node / key

。然後判斷是否是勾選操作，進行同父id進行對比，這裡的代碼其實可以直接簡化取

checkedArr

數組裡第一個下标值就好了并記錄父節點id。

2.判斷目前勾選節點的父節點是否跟先前有已勾選的相同。

3.是相同的話重新擷取過已勾選的

node / key

的方法

4.已選數組裡為空則說明未存在已勾選節點，同樣重新擷取過樹的擷取節點方法

5. 判斷為取消勾選時，如果樹已經不存在勾選節點了，則把記錄id的值設定null