https://flitrue.github.io/vue-awesome-pull-refresh/
A pull down refresh component implements by vuejs. https://flitrue.github.io/vue-awesome-pull-refresh/
https://flitrue.github.io/vue-awesome-pull-refresh/
pull-refresh vue-component vuejs
Last synced: about 1 year ago
JSON representation
A pull down refresh component implements by vuejs. https://flitrue.github.io/vue-awesome-pull-refresh/
- Host: GitHub
- URL: https://flitrue.github.io/vue-awesome-pull-refresh/
- Owner: flitrue
- License: mit
- Created: 2018-05-17T08:44:28.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-06-05T06:09:33.000Z (almost 8 years ago)
- Last Synced: 2024-05-22T18:07:19.201Z (almost 2 years ago)
- Topics: pull-refresh, vue-component, vuejs
- Language: Vue
- Homepage:
- Size: 180 KB
- Stars: 4
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-awesome-pull-refresh
[](https://www.travis-ci.org/flitrue/vue-awesome-pull-refresh)
[](https://app.fossa.io/projects/git%2Bgithub.com%2Fflitrue%2Fvue-awesome-pull-refresh?ref=badge_shield)
> A pull down refresh component implements by vuejs 2.0 for mobile.
## Demo
[Demo](https://flitrue.github.io/vue-awesome-pull-refresh)
PS: Please use browsers that support Promise
## Usage
### Install
```bash
npm install vue-awesome-pull-refresh --save
```
### CommonJS
```javascript
var VuePullRefresh = require('vue-awesome-pull-refresh');
new Vue({
components: {
'vue-pull-refresh': VuePullRefresh
},
data: function () {
return {};
},
methods: {
onRefresh: function() {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, 1000);
});
}
},
template: ''
});
```
### ES6
```javascript
import VuePullRefresh from 'vue-awesome-pull-refresh';
new Vue({
components: {
'vue-pull-refresh': VuePullRefresh
},
data: function () {
return {};
},
methods: {
onRefresh: function() {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, 1000);
});
}
},
template: ''
});
```
### Props
| Property | Description |
|:--|:--|
| onRefresh | refresh event;Should return a promise. |
| config | {
errorLabel: label shows when error
startLabel: label shows when pull down start
readyLabel: label shows when ready to refresh
loadingLabel: label shows when loading
pullDownHeight: the height toggle pull down refresh action
} |
## Contribution
First, install dependencies
```
npm install
```
Second, setup development environment
```
npm run dev
```
## License
[MIT](http://opensource.org/licenses/MIT)
[](https://app.fossa.io/projects/git%2Bgithub.com%2Fflitrue%2Fvue-awesome-pull-refresh?ref=badge_large)