v-scroll-auto
v1.1.0
Published
Scroll auto for list.
Downloads
6
Maintainers
Readme
v-scroll-auto
Scroll auto for list.
Usage
Install
npm install --save v-scroll-auto
Global registration
import Vue from "vue";
import ScrollAuto from "v-scroll-auto";
Vue.use(ScrollAuto);
In-component registration
import ScrollAuto from "v-scroll-auto";
export default {
directives: {
ScrollAuto
}
};
Directive Attrs
value
- target element, example:<div v-scroll-auto='ul'><ul>...</ul></div>
- modifier
x
- use x axis, example:<ul v-scroll-auto.x>...</ul>
- argument - speed, example:
<ul v-scroll-auto:10></ul>
Complete example
<template>
<div>
<label>Default:</label>
<ul class="cm-list-unstyled cm-padding-medium" v-scroll-auto>
<li class="cm-margin-top-base" v-for="item in 5" :key="item">
<el-button>{{ item }}</el-button>
</li>
</ul>
<label>speed = 5, axis = x:</label>
<ul
class="cm-list-unstyled cm-flex cm-padding-large cm-border-base"
v-scroll-auto:5.x
>
<li v-for="item in 10" :key="item">
<el-button style="width: 200px;" type="primary">{{ item }}</el-button>
</li>
</ul>
</div>
</template>
<script>
import { ScrollAuto } from "v-scroll-auto";
export default {
directives: {
ScrollAuto
}
};
</script>