InfiniteScroll 無限滾動

捲到底自動載入下一批。使用 Element Plus 的 v-infinite-scroll 指令(不是元件)。

設計準則

• 和 Pagination 的分工:動態訊息流(通知、動態)用無限滾動;需要定位、比較、回頭找的資料(表格、搜尋結果)用分頁
• 載入中要有提示(「載入中⋯」);到底了要說「沒有更多了」,不要讓使用者一直等
• 容器要固定高度才會觸發;別忘了搭配 Empty 處理一開始就沒資料的情況

基本用法

捲動下面的清單到底,會自動補上新的一批:

loading

Do / Don't

✅ Do	❌ Don't
訊息流、通知列表	資料表格也無限滾動
到底顯示「沒有更多了」	讓使用者對著轉圈等
搭配空狀態	沒資料時一片空白

給工程師

完整 API 見 Element Plus InfiniteScroll 文件。 本站規範優先於 EP 文件中的視覺建議。