上一篇我們實現了el-tree中子節點的選擇與添加，此外，我們還需要實現點擊右側刪除按鈕的時候，左側選擇器的選中狀態同步改變，checkList數組和checkIdList數組對應的數據能夠同步刪除。
由于左側與右側綁定的是同一數組，只需要刪除時傳入item，將checkList中的item刪除，左側選擇器的選中狀態就可同步改變。如圖：
此時還需要刪除checkIdList數組中對應的id。可先循環后臺數據，找到要刪除元素所在的那條數據并獲取其id，再將checkIdList數組中的id刪除即可。如圖：
最后，我們還需要一個關鍵詞搜索的功能。利用filter函數，當匹配到關鍵詞就返回他所在的那條數據，并賦給一個新的數組。
可是這里有一個問題，每次搜索完之后樹節點都是關閉狀態，需要手動將其展開，這樣用戶體驗感非常不好。看了一下ElementUI官網，有提供default-expanded-keys屬性，控制默認展開的節點的 key 的數組。所以我們在el-tree標簽上添加這個屬性：
方法內使用過濾器的時候直接將默認需要展開的節點id加到expandKeys數組中。
這樣搜索完樹節點便都是展開狀態，用戶能直接的看到數據，效果如圖所示：
上一篇： Echarts自定義提示框文字
