文章詳情頁
javascript - 怎么用空白DIV填充的方法解決列表數據過多的問題?
瀏覽:150日期:2023-05-30 09:38:35
問題描述
用vue做列表頁面時發現一個問題:一條數據獨占一行,一個屏幕能放十條左右的數據,滾動條滾動到底時加載新的數據。但是數據量特別大的時候,可能是幾萬條,那么HTML里就會存在很多的DOM節點,這個時候我想用空白的p來替代不在屏幕內的數據列表,比如說只在HTML中只顯示3個屏幕內能放下的數據節點,其余的數據用兩個p來填充,當滾動條滾到一個屏幕的高度時,替換展示的數據(VUE中用一個數組控制展示的數據),然后再計算上下兩個p的高度,求實現方法。
問題解答
回答1:我理解題主的思路,是純前端的優化,控制頁面元素的數量,是有意義的。
并不是所有的場景都適合做分頁,現在有很多列表是滾動加載的,越滾數據越多。。
至于實現,感覺題主說的已經比較清晰了。。根據高度計算應該顯示的行就 ok 了,但我感覺上下空白的 p 不是很必要
回答2:不考慮做個分頁什么的嗎?你想這么做的意義是什么呢?
回答3:同樓上,這種情況,分頁的意義完全大于你這樣去寫(segemenfault直接搜Vue分頁組件,有現成的,不過不是Vue2.0)。 可能,你是覺得有數據量很小的情況,和多一個分頁組件,會很丑。
回答4:你這個的做法,感覺就是瞎折騰,工作量大,也不好。用一個分頁組件吧!element就有。分頁組件。實現效果
標簽:
JavaScript
上一條:javascript - 后臺返回的值{865946021169972: false},怎么拿到這個布爾值下一條:javascript - angular中如何創建一個能被不同模塊中組件都能訪問其屬性和方法的對象
相關文章:
1. 在應用配置文件 app.php 中找不到’route_check_cache’配置項2. html按鍵開關如何提交我想需要的值到數據庫3. mysql取模分表與分表4. HTML 5輸入框只能輸入漢字、字母、數字、標點符號?正則如何寫?5. gvim - 誰有vim里CSS的Indent文件, 能縮進@media里面的6. dockerfile - 我用docker build的時候出現下邊問題 麻煩幫我看一下7. 跟著課件一模一樣的操作使用tp6,出現了錯誤8. PHP類屬性聲明?9. objective-c - ios 怎么實現微信聯系列表 最好是swift10. javascript - 請教如何獲取百度貼吧新增的兩個加密參數
排行榜
