pull-to-refresh

1.2.3 • Public • Published

Pull-to-refresh

Build Status Coverage Status

A pull to refresh component for developers who loves elegence solution.

Now works with webpack and browserify, it's supposed to works with iscroll-component

To make them works reansonable, they are decoupled in 1.0.0

demo. code of demo

Features

  • Call refresh as you need.
  • Simplified code and API.
  • Works with promise

Installation

Prefer to install with npm:

$ npm install pull-to-refresh

Install with component(1):

$ component install chemzqm/pull-to-refresh

Example

.scrollable {
  position: fixed;
  top: 50px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
<div id="demo" class="scrollable">
  <div>
    <ul>
      <li></li>
    </ul>
  </div>
</div>

Notice the scrollable must have a single child for iscroll-component to work

var el = document.getElementById('demo')
var Ptr = require('pull-to-refresh')
var is = Iscroll(el, { handlebar: true })
var ptr = new Ptr(el, function() {
    return ajax_and_prepend_dom( ) // refresh your data, should return promise
  })
})

You can think iscroll just add nagetive scrollTop value to the scrollable.

API

Ptr(el, [option], callback)

  • el the scrollable element
  • callback is called when loading start, the first argument which is a callback function should be called after the dom prepend to the list.
  • option.timeout for the request timeout in millisecond.
  • option.template contains a custom template(string or element) for the inserted element
  • option.timeout millisecond of request timeout, default 10000

.refresh()

Perform refresh (with animation scroll to top at first).

.unbind()

Unbind all event listeners

License

The MIT License (MIT)

Readme

Keywords

Package Sidebar

Install

npm i pull-to-refresh

Weekly Downloads

5

Version

1.2.3

License

MIT

Last publish

Collaborators

  • chemzqm