搜尋

首頁  >  問答  >  主體

javascript - 怎麼用空白DIV填滿的方法解決清單資料過多的問題?

用vue做列表頁面時發現一個問題:一條數據獨佔一行,一個螢幕能放十條左右的數據,滾動條滾動到底時加載新的數據。但是資料量特別大的時候,可能是幾萬條,那麼HTML裡就會存在很多的DOM節點,這時候我想用空白的p來取代不在螢幕內的資料列表,比如說只在HTML中只顯示3個螢幕內能放下的資料節點,其餘的資料用兩個p來填充,當滾動條滾到一個螢幕的高度時,替換展示的資料(VUE中用一個陣列控制展示的資料),然後再計算上下兩個p的高度,求實現方法。

漂亮男人漂亮男人2709 天前819

全部回覆(4)我來回復

  • 大家讲道理

    大家讲道理2017-06-26 10:56:26

    我理解題主的思路,是純前端的最佳化,控制頁面元素的數量,是有意義的。

    並不是所有的場景都適合做分頁,現在有很多清單是滾動載入的,越滾資料越多。 。

    至於實現,感覺題主說的已經比較清晰了。 。根據高度計算應該顯示的行就 ok 了,但我感覺上下空白的 p 不是很必要

    回覆
    0
  • 女神的闺蜜爱上我

    女神的闺蜜爱上我2017-06-26 10:56:26

    不考慮做個分頁什麼的嗎?你想這麼做的意義是什麼?

    回覆
    0
  • 大家讲道理

    大家讲道理2017-06-26 10:56:26

    同樓上,這種情況,分頁的意義完全大於你這樣去寫(segemenfault直接搜Vue分頁組件,有現成的,不過不是Vue2.0)。 可能,你是覺得有數據量很小的情況,和多一個分頁組件,會很醜。

    回覆
    0
  • 大家讲道理

    大家讲道理2017-06-26 10:56:26

    你這個的做法,感覺就是瞎折騰,工作量大,也不好。用一個分頁元件吧! element就有。分頁組件。實現效果

    回覆
    0
  • 取消回覆