onReachBottom
使用注意 可在pages.json里定義具體頁面底部的觸發距離onReachBottomDistance,比如設為50,那么滾動頁面到距離底部50px時,就會觸發onReachBottom事件。
如使用scroll-view導致頁面沒有滾動,則觸底事件不會被觸發。scroll-view滾動到底部的事件請參考scroll-view的文檔
onPageScroll
(監聽滾動、滾動監聽、滾動事件)參數說明:
屬性 | 類型 | 說明 |
---|---|---|
scrollTop | Number | 頁面在垂直方向已滾動的距離(單位px) |
注意
onPageScroll
里不要寫交互復雜的js,比如頻繁修改頁面。因為這個生命周期是在渲染層觸發的,在非h5端,js是在邏輯層執行的,兩層之間通信是有損耗的。如果在滾動過程中,頻發觸發兩層之間的數據交換,可能會造成卡頓。- 如果想實現滾動時標題欄透明漸變,在App和H5下,可在pages.json中配置titleNView下的type為transparent,參考。
- 如果需要滾動吸頂固定某些元素,推薦使用css的粘性布局,參考插件市場。插件市場也有其他js實現的吸頂插件,但性能不佳,需要時可自行搜索。
- 在App、微信小程序、H5中,也可以使用wxs監聽滾動,參考;在app-nvue中,可以使用bindingx監聽滾動,參考。
-
onPageScroll : function(e) { //nvue暫不支持滾動監聽,可用bindingx代替 console.log("滾動距離為:" + e.scrollTop); },