一展融、enablePullDownRefresh
1、下拉刷新enablePullDownRefresh的支持
單頁面配置json文件
{
"enablePullDownRefresh": true
}
app.json配置(所有頁面都帶有下拉刷新功能)
{
"window": {
"enablePullDownRefresh": true
}
}
2豫柬、設(shè)置backgroundTextStyle
大家會(huì)發(fā)現(xiàn)別人的小程序下拉刷新是有三個(gè)點(diǎn)閃爍的動(dòng)畫告希、自己設(shè)置的并沒有。這里面有個(gè)設(shè)置backgroundTextStyle的支持:
WX20190522-150653@2x.png
"backgroundTextStyle": ""烧给,支持 dark/light
3燕偶、停止stopPullDownRefresh
微信小程序還提供了停止下拉刷新的API:
https://developers.weixin.qq.com/miniprogram/dev/api/wx.stopPullDownRefresh.html
wx.stopPullDownRefresh()
二、onReachBottomDistance上拉觸底
1础嫡、頁面上拉觸底事件觸發(fā)時(shí)距頁面底部距離指么,單位為px酝惧。
(單頁面json配置,app.json的window配置中配置 全部頁面的上拉觸底)
"onReachBottomDistance": 50//默認(rèn)值是50
2伯诬、在Page.onReachBottom里面進(jìn)行渲染數(shù)據(jù)及查看
/**
* 頁面上拉觸底事件的處理函數(shù)
*/
onReachBottom: function () {
console.log("頁面上拉觸底事件的處理函數(shù)")
},
三晚唇、動(dòng)態(tài)設(shè)置下拉背景字體、loading 圖的樣式
wx.setBackgroundTextStyle({
textStyle: 'dark' // 下拉背景字體盗似、loading 圖的樣式為dark
})
四哩陕、動(dòng)態(tài)設(shè)置窗口的背景色
wx.setBackgroundColor({
backgroundColor: '#ffffff', // 窗口的背景色為白色
})
<!--兼容ios-->
wx.setBackgroundColor({
backgroundColorTop: '#DC143C', // 頂部窗口的背景色為紅
backgroundColorBottom: '#00FA9A', // 底部窗口的背景色為綠
})