-
在js文件里直接重写"onPullDownRefresh"和"onReachBottom"方法即可;
-
xml <scroll-view scroll-y = true > ......... </scroll-view> js onPullDownRefresh: function() { // Do something when pull down. console.log('刷新'); }, onReachBottom: function() { // Do something when page reach bottom. console.log('circle 下一页'); },
-
-
在scroll-view里设定bindscrolltoupper和bindscrolltolower,然后在js里写好触发事件后对应的方法。[注意,使用这个模式一定要设置scroll-view的高度,100%不知道为什么设置后没效果,建议使用100vh]
-
-
xml
<scroll-view scroll-y = true bindscrolltolower="loadMore" bindscrolltoupper="refesh"> .......... </scroll-view>
-
js
onPullDownRefresh: function() { // Do something when pull down. console.log('刷新'); }, onReachBottom: function() { // Do something when page reach bottom. console.log('circle 下一页'); },
二:弹窗的两种姿势
-
-
直接在代码里控制
-
-
js
showLoading:function(){ wx.showToast({ title: '加载中', icon: 'loading' }); }, cancelLoading:function(){ wx.hideToast(); }
-
-
在wxml文件里布局弹窗,利用条件渲染,在js代码里控制是否显示
-
-
wxml
<view > <loading wx:if="{{showLoading}}">加载中</loading> </view>
-
js
data: { showLoading:true }, showLoading:function(){ this.setData({ showLoading:true }) }, cancelLoading:function(){ this.setData({ showLoading:false })
-