element ui 樹控件默認選中 高亮顯示

例如我要默認顯示選中‘所有數據’這個項

首先，給樹組件指定ref ，其次加 node-key=‘id’ （其中id 是循環樹控件每個項的Id值），最后:highlight-current="true"，注意先后順序問題

<el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" :highlight-current="true" ref="tree" node-key="id"
       default-expand-all @node-click="handleNodeClick" class="elTreeStyleTwo"
/>
                

然后，在Created默認生命周期創建的方法里執行setCurrentKey(Id值)，如下代碼

this.$nextTick(() => { // tree 元素的ref value 綁定的node-key
        this.$refs.tree.setCurrentKey(101); });

最后，就是找到你要顯示項目對應的Id

/** 查詢部門下拉樹結構 */ getTreeSelect() { this.deptOptions = [ { id:1, label:'發貨單', children:[{id:101,label:'所有單據'},{id:102,label:'正操作'},{id:103,label:'待提貨'},{id:104,label:'已提貨'}] }, ] },

這樣就Ok啦