Wechat applet drop-down refresh

The original address: www.cnblogs.com/xunxian/p/1…

WeChat small program development documentation: developers.weixin.qq.com/miniprogram…

The Api used in this article

wx.showNavigationBarLoading(Object object)
wx.showLoading(Object object)
wx.hideLoading(Object object)
wx.hideNavigationBarLoading(Object object)
wx.stopPullDownRefresh(Object object)
wx.request(Object object)
Copy the code

Function () {this.onrefresh (); this.onrefresh (); this.onrefresh (); }, / / refresh onRefresh () {/ / display the navigation bar in the current page loading animation wx. ShowNavigationBarLoading (); // Displays a loading prompt box. Wx. showLoading({title: 'Refresh... ', }) this.getData(); }, getData(){wx.request({url: ", // Complete (res){// Hide the loading dialog wx.hideloading (); / / hide the navigation bar loading animation wx hideNavigationBarLoading (); Wx.stoppulldownrefresh (); wx.stoppulldownRefresh (); wx.stoppulldownRefresh (); }})},Copy the code

In addition to the logic for writing responses in the JS page, you also need to write the following configuration in the JSON of the corresponding page, which allows the page to perform a drop-down refresh action

{
   "enablePullDownRefresh": true
}
Copy the code

In a Wx :for loop there are two different arrays of length contents

Use wx:for’s index to iterate through group 2

{{list2[index].name}} {{list2[index].name}} {list2[index].name}}

Small program loop two – dimensional array rendering list

Page({ 
    mapData:[ 
        [{id:11},{id:12}], 
        [{id:21},{id:22}], 
        [{id:31},{id:32},{id:33}]
    ] 
})
Copy the code
<view wx:for="{{mapData}}"  wx:for-item="item"> 
    <view wx:for="{{item}}"> {{item.id}} </view> 
</view>
Copy the code