- onload等生命中期本文不講解
onPullDownRefresh
監(jiān)聽用戶下拉動(dòng)作狭姨，一般用于下拉刷新，參考示例
- 需要在
pages.json里绣溜，找到的當(dāng)前頁面的pages節(jié)點(diǎn)竞漾，并在style選項(xiàng)中開啟enablePullDownRefresh放钦。 - 當(dāng)處理完數(shù)據(jù)刷新后，
uni.stopPullDownRefresh可以停止當(dāng)前頁面的下拉刷新错负。
uni.startPullDownRefresh(OBJECT)
開始下拉刷新坟瓢，調(diào)用后觸發(fā)下拉刷新動(dòng)畫，效果與用戶手動(dòng)下拉刷新一致犹撒。
uni.stopPullDownRefresh()
停止當(dāng)前頁面下拉刷新折联。
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "uni-app",
"enablePullDownRefresh": true
}
}
],
// 僅做示例，實(shí)際開發(fā)中延時(shí)根據(jù)需求來使用识颊。
export default {
data() {
return {
text: 'uni-app'
}
},
onLoad: function (options) {
setTimeout(function () {
console.log('start pulldown');
}, 1000);
uni.startPullDownRefresh();
},
onPullDownRefresh() {
console.log('refresh');
setTimeout(function () {
uni.stopPullDownRefresh();
}, 1000);
}
}
onReachBottom
頁面滾動(dòng)到底部的事件（不是scroll-view滾到底）崭庸，常用于下拉下一頁數(shù)據(jù)。
onReachBottom使用注意 可在pages.json里定義具體頁面底部的觸發(fā)距離onReachBottomDistance谊囚，比如設(shè)為50怕享，那么滾動(dòng)頁面到距離底部50px時(shí)，就會(huì)觸發(fā)onReachBottom事件镰踏。
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首頁",
"onReachBottonDistance": 50 // 距離底部50px時(shí)函筋，觸發(fā)onReachBottom事件
},
onPageScroll （監(jiān)聽滾動(dòng)、滾動(dòng)監(jiān)聽奠伪、滾動(dòng)事件）參數(shù)說明：
注意
-
onPageScroll里不要寫交互復(fù)雜的js跌帐，比如頻繁修改頁面首懈。因?yàn)檫@個(gè)生命周期是在渲染層觸發(fā)的，在非h5端谨敛，js是在邏輯層執(zhí)行的究履，兩層之間通信是有損耗的。如果在滾動(dòng)過程中脸狸，頻發(fā)觸發(fā)兩層之間的數(shù)據(jù)交換最仑，可能會(huì)造成卡頓。 - 如果想實(shí)現(xiàn)滾動(dòng)時(shí)標(biāo)題欄透明漸變炊甲，在App和H5下泥彤，可在pages.json中配置titleNView下的type為transparent，參考卿啡。
- 如果需要滾動(dòng)吸頂固定某些元素吟吝，推薦使用css的粘性布局，參考插件市場颈娜。插件市場也有其他js實(shí)現(xiàn)的吸頂插件剑逃，但性能不佳，需要時(shí)可自行搜索官辽。
onPageScroll : function(e) { //nvue暫不支持滾動(dòng)監(jiān)聽蛹磺，可用bindingx代替
console.log("滾動(dòng)距離為：" + e.scrollTop);
},
onShareAppMessage用戶點(diǎn)擊右上角分享(小程序)
onShareTimeline監(jiān)聽用戶點(diǎn)擊右上角轉(zhuǎn)發(fā)到朋友圈(微信小程序)
onAddToFavorites監(jiān)聽用戶點(diǎn)擊右上角收藏(微信小程序)
onResize監(jiān)聽窗口尺寸變化
