由于官方scroll-view组件只有滚到顶部刷新的机制,对用户来说不是很友好,所以做一个基于scroll-view的下拉刷新组件(该组件支持原生引用、wexp框架、wepy框架)
npm i weapp-scroll-view-refresh -S --production
usingComponents: {
'k-scroll': 'weapp-scroll-view-refresh/index'
}
<k-scroll
id="k-scroll"
custom-class="scroll-view"
bind:refresh="refresh"
bind:scroll="scroll"
bind:lower="lower">
<view>content</view>
</k-scroll>
参数 |
说明 |
类型 |
可选值 |
默认值 |
lowerThresHold |
距底部多远时触发 scrolltolower 事件 |
Number |
|
50 |
scrollWithAnimation |
在设置滚动条位置时使用动画过渡 |
Boolean |
true false |
false |
enableBackToTop |
iOS点击顶部状态栏、安卓双击标题栏时,滚动条返回顶部,只支持竖向 |
Boolean |
true false |
false |
scrollIntoView |
值应为某子元素id(id不能以数字开头)。设置哪个方向可滚动,则在哪个方向滚动到该元素 |
String |
|
|
事件名 |
说明 |
参数 |
bind:scroll |
组件滚动触发该事件 |
event.detail: 回传滚动的高度 |
bind:scrollToLower |
组件滚动到底部触发该事件 |
无回传参数 |
bind:refresh |
组件刷新操作的时候触发该事件 |
无回传参数 |
参考原版插件。