javascript - iview select 資料項大於500以上時路由跳轉很慢

Question

版本：
"vue": "^2.2.2"
"iview": "^2.0.0-rc.15"

大家好，現在在用iview開發後台系統，遇到Select元件資料項大於500以上時路由跳轉很慢的問題。慢的時候要15秒以上才能跳轉。後來嘗試用了element ui，發現在也需要2秒左右的時間跳躍。

請問Select 元件在資料量比較大的時候怎麼處理才好降低跳轉切換時間？

Answer 1

iview和element UI都是一個毛病

每個選項都是一個元件，每個選項也要綁定若干事件。
你這500個以上的選項，也就是說光是這個Select就有500個以上的組件，每個組件下屬的DOM元素還被綁定若干事件，渲染起來當然超級慢。

我之前也碰到了這個問題，答案是除非你這個Select不要用iview或element UI，否則毫無辦法。
我是針對選項太多的Select單獨寫了個組件，當然樣式風格是仿照iview的，畢竟風格要保持一致，但是其內部的業務邏輯和iview完全不同，做了很多針對性的優化。

Answer 2

可以嘗試將資料分組，然後使用連級選擇來選擇資料。

Answer 3

一次要求很多資料當然會很慢，你可以分頁顯示。

Answer 4

用tree組件時有4000節點，基本上處於卡死狀態，沒辦法改成點擊才載入了。

select組件跳轉，既然500節點，一次性展示應該也不是很友好，可以考慮帶搜索的select，每次根據搜索值返回固定50或者100個，就是增加了後端邏輯。