https://github.com/bajian/vue-pull-to-refresh

vue.js,refresh,load more,Vue2.0 上下拉刷新
https://github.com/bajian/vue-pull-to-refresh

load loadmore pull-to-refresh vue

Last synced: 2 days ago
JSON representation

vue.js,refresh,load more,Vue2.0 上下拉刷新

• Host: GitHub
• URL: https://github.com/bajian/vue-pull-to-refresh
• Owner: bajian
• Created: 2016-09-26T07:37:14.000Z (about 8 years ago)
• Default Branch: master
• Last Pushed: 2018-12-05T03:42:40.000Z (almost 6 years ago)
• Last Synced: 2024-08-02T09:24:02.540Z (3 months ago)
• Topics: load, loadmore, pull-to-refresh, vue
• Language: JavaScript
• Homepage:
• Size: 380 KB
• Stars: 137
• Watchers: 6
• Forks: 43
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-vue - vue-pull-to-refresh - pull-to-refresh?style=social) - Vue2的上拉下拉 (UI组件)
• awesome-github-vue - vue-pull-to-refresh - Vue2的上拉下拉 (UI组件)
• awesome-github-vue - vue-pull-to-refresh - Vue2的上拉下拉 (UI组件)
• awesome - vue-pull-to-refresh - Vue2的上拉下拉 (UI组件)

README

        
# pull2refresh

alternatively pull down or pull up or both for Vue2.+

> A Vue.js project with vue-cli3

## demo

[live-demo](https://bajian.github.io/vue-pull-to-refresh/dist/index.html)

## Build Setup DEMO

``` bash

# install dependencies

npm install

# serve with hot reload at localhost:8080

npm run serve

# build for production with minification

npm run build

```

```html

  

    


      


        # item {{ index }} 

      

    

  

```


```js

import PullToRefresh from './components/pull-to-refresh'

onPullup(finshCallback) {

      setTimeout(()=>{

        this.items=this.items.concat([6,6,6,6,6,6,6,6,6,6,6])

        finshCallback();//finish the refreshing state

      },3000);

    }

```

## Api

### Properties

| Name                 | Type      | Default      | Description                                                        |

|----------------------|-----------|--------------|--------------------------------------------------------------------|

| disable-pullup            | `Boolean`  | `false` | set true to disable pullup function|

| disable-pulldown            | `Boolean`  | `false` | set true to disable pulldown function|

| on-pullup   | `Function` | `undefined`       | the pullup listener with a finshCallback param to tell it to finsh refreshing state |

| on-pulldown   | `Function` | `undefined`       | the pulldown listener with a finshCallback param to tell it to finsh refreshing state |

| ==================== | ========= | ============ | =================== |

for convenience & efficiency ,i donot set the tips and timeout editable,

if u want to edit ,just edit as u like:

```js

const PULL_DOWN_NORMAL='下拉刷新'

const PULL_DOWN_RELEASE='释放加载'

const PULL_DOWN_LOADING='加载中，请稍后'

const PULL_UP_NORMAL='上拉刷新'

const PULL_UP_RELEASE='释放加载'

const PULL_UP_LOADING='加载中，请稍后'

timeout=30000//the 30s timeout of reseting refreshing state if u donnot call the finshCallback

```