下拉與上拉在載入資料上面基本一致，但是因為方向不同，所以也存在以下不同之處。
上拉是將資料載入到原資料後面，所以用的是陣列拼接 concat 方法。而下拉是將資料新增到原資料前面，所以需要使用 unshift 方法。
上拉是滑動到底部時觸發，下拉是滑動到頂部時觸發，因此判斷 scrolltop 為 0 時觸發，觸發完之後需要將 scrolltop 重置一下。
**中有很多定時器的使用，主要是為了防止使用者頻繁滑動（節流）以及在列表渲染之後再去獲取 dom 屬性。
封裝乙個載入資料的方法，首先載入初始資料；
獲取列表的 scrollheight，將記錄定位到最底部，也就是最新的記錄在可視區域的最下面。
監聽滑動，當滑動到最頂部時，載入一屏資料，同時滑動定位到上次初始的位置。
<
!doctype html>
"zh"
>
"utf-8"
>
"viewport"
content=
"width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
>
"x-ua-compatible" content=
"ie=edge"
>
document<
/title>
.container
.item
<
/style>
<
/head>
>
="container" ref=
"container"
>
="item"
>
}<
/div>
for=
"(item, index) in list"
:key=
"index"
class
="item"
>
}<
/div>
<
/div>
<
/div>
"">
<
/script>
newvue(,
mounted()
,10);
container.
addeventlistener
('scroll'
,(e)
=>
//滑到頂部時觸發下次資料載入
if(e.target.scrolltop ==0)
,100);
}},2000);
});}
, methods:
this
.pagenum++;}
}})<
/script>
<
/body>
<
/html>
h5下拉重新整理和上拉載入外掛程式mescroll
官網 基本使用 建立mescroll物件 var mescroll new mescroll area empty clearemptyid itemwrap 1.下拉重新整理時會自動先清空此列表,再加入資料 2.無任何資料時會在此列表自動提示空 use true,delay 0 重置列表資料 鎖定...
h5 實現頁面上拉載入更多資料
html style部分 html部分 js部分 js部分主要就是監控上拉，調介面 上拉載入更多css style wait loading keyframes waitloading 100 loading loading txt ending style div class loading st...
微信小程式下拉重新整理和上拉載入更多
因為專案裡面，經常會用到此功能，所以我們封裝乙個外掛程式。裡面應用到vant的元件 1.在compontent裡面建立乙個檔案，名字隨意 布局檔案 message scroll view client pool list scroll y lower threshold 1 bindtouchsta...