elementuui 樹 默認高亮一個節點

問題描述:每次刷新頁面以後都默認高亮顯示上次點擊的節點。
這裏咱們默認顯示第一個字節點,當項目中實際用到的時候把第一個子節點換成點擊的節點就能夠了。
實現方式
首先樹節點的數據格式以下:
vue

每一個節點都包含了一個id和標籤label。id用於標記這個節點,label用於節點具體顯示的內容。
前段頁面的格式
在這裏插入圖片描述
這裏我設置瞭如下內容:node

  • ref="vueTree"指代這顆樹名爲vueTree
  • node-key="id"表示使用每一個節點的"id"對應的值來表示每一個節點,例如對於上面的數據,id=0時就指代個人第一個節點"us-east-1"
  • highlight-current"表示高亮選中的節點
  • props設置爲默認格式
  • default-expand-all表示默認展開全部節點

每次加載完樹節點的數據後,須要設置一下默認高亮的節點爲id=0的節點:
在這裏插入圖片描述this

如上圖所示,每次加載完樹節點的數據後(即在代碼this.treeData = res.tree_node執行以後),使用:spa

`this.$nextTick(() => {
     this.$refs.vueTree.setCurrentKey(0);
})`

就能夠默認讓第一個子節點高亮了(也就是id=0的節點)
這裏vueTree是頁面當中那顆樹的名字
由於頁面中已經設置了node-key="id",因此setCurrentKey(0)中的0表示當前選中的節點爲id爲0的節點.net

原文件地址:https://blog.csdn.net/AXIMI/article/details/101023946code

相關文章
相關標籤/搜索