vue-scroller-loading

Vue Scroller Loading support smooth scroll, pull to refresh & infinite loading.

Reference

See also Vue-Scroller doing recursion instead of timer(setInterval) to improve performance.

Demo

https://lzyerliu.github.io/vue-scroller-loading

Usage

# install
npm install vue-scroller-loading -S (or cnpm install vue-scroller-loading -S)

/* ignore this if you include vue-scroller.js by <script> tag from a cdn, such as unpkg */
import Vue from 'vue'
import Scroller from 'vue-scroller-loading'
Vue.use(Scroller)

<scroller
  :on-refresh="refresh"
  :on-infinite="infinite"
> 
  <!-- content to here -->
</scroller>

API

vue-scroller-loading component attributes:

| Attr. Name | Description | Required | Default Value | |-----|-----|-----|-----| | onRefresh | pull to refresh callback | N | - | | onInfinite | infinite loading callback | N | - | | refreshText | tips of pull-to-refresh | N | 下拉刷新 | | releaseText | tips of pull-to-refresh | N | 松开更新 | | noDataText | tips of no-more-data when infinite-loading finished | N | 没有更多数据 | | width | scroller container width | N | 100% | | height | scroller container height | N | 100% | | snapping | enable snapping mode | N | false | | snappingWidth | snapping width | N | 100 (stand for 100px) | | snappingHeight | snapping height | N | 100 | | refreshLayerColor | text color of pull-to-refresh layer | N | #999 | | loadingLayerColor | text color of infinite-loading layer | N | #999 | | minContentHeight | min content height (px) of scroll-content | N | 0 |