13-如何觸發選中指定Tree節點的選中狀態及事件/操作tree數據后刷新數據后保留原來的收縮展開狀態


設置選中指定節點:

this.$refs.treeRef.setCurrentKey('要設置節點對應的id');

通常我們在設置完選中的節點的時候要觸發這個節點的node-click事件,顯示該節點對應的詳情信息,要想調用handleClick事件,我們需要用:

let node = this.$refs.treeRef.getNode('節點id');

既然能拿到當前節點的node(節點信息)那就能拿到data。所以在執行this.handleClick的時候就傳入需要的參數。

事例文章


操作tree數據后刷新數據后保留原來的收縮展開狀態 

簡單的說就是對當前一個樹做了增刪改上下移動后原數據發生了變化, 發生了變化就得重新調用回顯樹的接口。那么重新調用接口就會造成樹節點初始化設置的要么全部展開要么全部折疊,所以我們記錄到操作之前節點的狀態

主組件中:(引入了tree組件)

樹組件:

    <el-tree ref="tree" @node-expand="handleNodeExpand" @node-collapse="handleNodeCollapse"
      ></el-tree>
  // 保存當前展開的節點
 handleNodeExpand(data) { let flag = false
      this.defaultShowNodes.some(item => { if (item === data.id) { // 判斷當前節點是否存在, 存在不做處理
          flag = true
          return true } }) if (!flag) { // 不存在則存到數組里
        this.defaultShowNodes.push(data.id) } }, // 樹節點關閉,實時更新defaultShowNodes存儲展開的節點數組
 handleNodeCollapse(data) { this.defaultShowNodes.some((item, i) => { if (item === data.id) { // 刪除關閉節點
          this.defaultShowNodes.length = i } }) },

 


免責聲明!

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



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