1. 效果圖 實現方式 使用的是vue + el-tree
2.需求
自定義一個切換按鈕 (下圖資產/非資產)
自定義添層級icon
關於樹的接口返回的結構我就不寫了(大家都知道),直接上代碼。
2.1-----------自定義圖標icon
沒有使用遞歸前,是這樣寫的代碼。出現的問題是,根本不知道要遍歷多少次,因為不知道到底有多少層。代碼臃腫。
使用遞歸,可以輕松實現多級遍歷 (實現效果,不知道有多少層,也沒關系,只要加個判斷就ok了)
2.2-----------自定義圖標切換按鈕
因為需要所有層級的總數據,所以我就采用了reduce求和
使用遞歸,可以輕松實現多級遍歷
最后關於實現效果圖我整理的數據是這樣
圖一是使用遞歸把所有有層級的數據push到一個數組中。圖二 是使用reduce 算出總數據