小程序上拉下拉共存時不可使用scroll-view的解決方法
阿新 • • 發佈:2018-03-27
下拉 text2 data nbsp css 必須 scroll wid 解決
使用 bindscrolltolower
,必須搭配使用的 scroll-view
會導致小程序 "enablePullDownRefresh": true
下拉不能使用。
解決方法,就是當兩者同時存在時,改 scroll-view
為 view
,改 bindscrolltolower
為 onReachBottom
函數。
這樣在上拉加載,跟下拉刷新同時存在的時候, "enablePullDownRefresh": true
就可以生效了。
- wxml
<view class="scroll-view"> <view class="view-item"><text>text1</text></view> <view class="view-item"><text>text2</text></view> <view class="view-item"><text>text3</text></view> <view class="view-item"><text>text4</text></view> <view class="view-item"><text>text5</text></view> <view class="view-item"><text>text6</text></view> <view class="view-item"><text>text7</text></view> <view class="view-item"><text>text8</text></view> <view class="view-item"><text>text9</text></view> </view>
- wxss
.scroll-view { height: 1300rpx; } .view-item { width: 33.333333%; height: 300rpx; float: left; color: #ffff; background: #888; }
- js
Page({ data: { }, onLoad: function(option) { wx.request({ }, success: function(res) { } }); }, // 加載數據函數 onReachBottom: function(event) { console.log("到底了"); }, })
小程序上拉下拉共存時不可使用scroll-view的解決方法