https://github.com/wangpin34/vue-scroll

Scroll directive on vue
https://github.com/wangpin34/vue-scroll

directive scroll vuejs vuejs2

Last synced: about 2 months ago
JSON representation

Scroll directive on vue

• Host: GitHub
• URL: https://github.com/wangpin34/vue-scroll
• Owner: wangpin34
• License: mit
• Archived: true
• Created: 2016-03-29T03:56:03.000Z (over 8 years ago)
• Default Branch: 2.0-compatible
• Last Pushed: 2023-01-05T00:04:18.000Z (almost 2 years ago)
• Last Synced: 2024-09-22T11:33:25.143Z (about 2 months ago)
• Topics: directive, scroll, vuejs, vuejs2
• Language: JavaScript
• Homepage:
• Size: 607 KB
• Stars: 246
• Watchers: 10
• Forks: 91
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# vue-scroll

scroll directive for [vuejs 2.0](https://vuejs.org/v2/guide/)

For vue 1.x, please use [email protected]. Currently its code is in master branch.

[![NPM](https://nodei.co/npm/vue-scroll.png?stars&downloads)](https://nodei.co/npm/vue-scroll/)

[![](https://img.shields.io/travis/wangpin34/vue-scroll.svg?style=flat-square)](https://travis-ci.org/wangpin34/vue-scroll)

[![Coveralls](https://img.shields.io/coveralls/wangpin34/vue-scroll.svg?style=flat-square)](https://coveralls.io/github/wangpin34/vue-scroll)

[![npm package](https://img.shields.io/npm/v/vue-scroll.svg?style=flat-square)](https://www.npmjs.org/package/vue-scroll)

[![NPM downloads](http://img.shields.io/npm/dm/vue-scroll.svg?style=flat-square)](https://npmjs.org/package/vue-scroll)

[![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/wangpin34/vue-scroll.svg)](http://isitmaintained.com/project/wangpin34/vue-scroll "Average time to resolve an issue")

## Installation

### NPM(recommended)

```

npm install vue-scroll --save

```

### Standalone

**Standalone bundle is not support on latest v2.1.0 currently**

Simple download from [releases](https://github.com/wangpin34/vue-scroll/releases) and include it in script tag.

## Get started

```javascript

import Vue from 'vue'

import vuescroll from 'vue-scroll'

Vue.use(vuescroll)

```

Directive v-scroll then can be used in any of your Component.

```App.vue

  


    


  


...

```

Method onScroll receives two arguments once scroll event is fired,

* e - event

* position - Object contains scrolling data

  - scrollTop Number

  - scrollLeft Number

## Advanced

throttle and debounce are supported since v2.1.0, you can enable it as global configurations like:

```javascript

Vue.use(vuescroll, {throttle: 600})

//Or

Vue.use(vuescroll, {debounce: 600})

```

Override global configurations like

```html



```

```html



```


## Demo

You please try the demo hosted on codesandbox: https://codesandbox.io/s/vuescroll-demo-orders-view-f4d3d?fontsize=14

## LICENSE

MIT