How to solve the Mini Program wepy pull-down

This article mainly introduces the Mini Program wepy pull-down how to solve the relevant knowledge, the content is detailed and easy to understand, simple and quick operation, has a certain reference value, I believe that you will have something to gain after reading this Mini Program wepy pull-down article, let's take a look.

It is a common function to pull down and load data on the list. The first thing that comes to mind is the scroll-view component, in which there are two events, bindscrolltoupper (pull to the top) and bindscrolltolower (pull to the bottom). The pull-up effect is very poor with bindscrolltoupper, which is triggered by a slight slide, that is to say, if there is a disagreement, the list will be pulled and refreshed, and the experience is very bad. Baidu on the Internet has said for a long time that scroll-view cannot be used in conjunction with onPullDownRefresh, although I do not understand it, but I think it is very powerful. Finally, I would like to sum up the ending method.

Do not use scroll-view components

Open the configuration on the required page (do not need to configure globally, I use wepy, do not need to write in app.wpy)

Config = {navigationBarTitleText: 'test up and down', / / do not write true as' true'enablePullDownRefresh: true,// does not deserve to be dark, then the three loading points will not be seen, but the three points are white. If the background of your page is also white, you will not see the effect. BackgroundTextStyle: 'dark'} make a long list.

{{I}} * {j}} = key events

OnPullDownRefresh () {console.log ('drop-down refresh list')} onReachBottom () {console.log ('pull up and load the next page')} wx.stopPullDownRefresh ()

OnPullDownRefresh () {console.log ('drop-down refresh list') / 5 seconds Analog data load setTimeout (function () {/ / without this method, the real machine pulldown will always be in refresh state, unable to reset wepy.stopPullDownRefresh ()}, 5000)} onReachBottom () {console.log ('pull up and load next page')} complete code

{{I}} * {{j}} = {{I * j}} import wepy from 'wepy' export default class Refresh extends wepy.page {config = {navigationBarTitleText:' test up and down', enablePullDownRefresh: true BackgroundTextStyle: 'dark'} components = {} data = {} computed = {} methods = {} events = {} onLoad () {} onPullDownRefresh () {console.log (' drop-down refresh list') setTimeout (function () {/ / without this method, the real machine will always be refreshed. Unable to reset wepy.stopPullDownRefresh ()}, 5000)} onReachBottom () {console.log ('pull up and load next page') wepy.showToast ({title: 'pull up and load next page', icon: 'none',mask: true,duration: 1000})} this is the end of the article on "how to solve Mini Program wepy pull-down". Thank you for reading! I believe you all have a certain understanding of the knowledge of "Mini Program wepy pull-down how to solve". If you want to learn more knowledge, you are welcome to follow the industry information channel.