Wechat applet (pull-down refresh data) novice to

Record a small problem that bothers you , Also give you a reference ~
When doing your own personal applet project , You need to implement the user pull-down refresh data , Read a lot of tutorials , They're all talking scroll-view To achieve , But I don't have high requirements for style , Just use the one that comes with wechat ~

To achieve the effect of ：

1, If you need to implement pull-down refresh globally , Can be in app.json file ,window Configure and enable pull-down refresh , Only oneortwo pages don't need to be refreshed by pull-down , It's on the page json File configuration , Turn off pull-down refresh

Turn on global pull-down refresh ----->
app.json：

{
    
 "window": {
    
                                //json The file cannot be commented , But for the convenience of explanation, it is written here ,
 "backgroundTextStyle": "dark", //backgroundTextStyle Support only dark / light, If set to light The loading animation of the three points is the same as the background color 
    "enablePullDownRefresh": true 
  }
}

Local close pull-down refresh ----->
index.json:

{
    
  "enablePullDownRefresh": false
}

Similarly, only oneortwo pages need to be refreshed , On the page of the page json File configuration , Start the pull-down refresh

2, The refresh data
Wechat will be triggered when we pull down the top onPullDownRefresh function , Here we can re request data
index.js:

async onPullDownRefresh(){
    
const res=await wx.request({
    
      url: xxx,
      method:xxx,
      data: xxx
})
// When the request is complete, we need to call  wx.stopPullDownRefresh() Stop refreshing , Drop down window bounce 
   wx.stopPullDownRefresh()
}

summary ： If the style requirements are not high , In this way, the effect can be achieved . stay onPullDownRefresh Function USES async An asynchronous function , Wait for the data to return , See my other articles for specific methods of requesting background data ！