微信小程序：enablePullDownRefresh、onReachBottomDistance 、动态设置窗口的背景色、动态设置下拉背景字体

一、enablePullDownRefresh

1、下拉刷新enablePullDownRefresh的支持

单页面配置json文件

{ "enablePullDownRefresh": true }

app.json配置（所有页面都带有下拉刷新功能）

{ "window": { "enablePullDownRefresh": true } }

2、设置backgroundTextStyle 大家会发现别人的小程序下拉刷新是有三个点闪烁的动画、自己设置的并没有。这里面有个设置backgroundTextStyle的支持:

"backgroundTextStyle": ""，支持 dark/light

3、停止stopPullDownRefresh

微信小程序还提供了停止下拉刷新的API: https://developers.weixin.qq.com/miniprogram/dev/api/wx.stopPullDownRefresh.html

wx.stopPullDownRefresh()

二、onReachBottomDistance上拉触底

1、页面上拉触底事件触发时距页面底部距离，单位为px。 （单页面json配置，app.json的window配置中配置 全部页面的上拉触底）

"onReachBottomDistance": 50//默认值是50

2、在Page.onReachBottom里面进行渲染数据及查看

/** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { console.log("页面上拉触底事件的处理函数") },

三、动态设置下拉背景字体、loading 图的样式

wx.setBackgroundTextStyle({ textStyle: 'dark' // 下拉背景字体、loading 图的样式为dark })

四、动态设置窗口的背景色

wx.setBackgroundColor({ backgroundColor: '#ffffff', // 窗口的背景色为白色 }) <!--兼容ios--> wx.setBackgroundColor({ backgroundColorTop: '#DC143C', // 顶部窗口的背景色为红 backgroundColorBottom: '#00FA9A', // 底部窗口的背景色为绿 })