Vue-slide
A Vue Slide Component to show Banners
Installation
NPM
npm install @seolhun/vue-slide --save
Register the component
import SlideVue from '@seolhun/vue-slide'
Vue.component('vue-slide', SlideVue);
Usage
1. Default items
<!--
const banners = [
{
image: '',
link: '',
}, {
image: '',
link: '',
},
]
-->
<vue-slide :items='banners'></vue-slide>
2. Custom items
<!--
const banners = [
{
img: '',
url: '',
}, {
img: '',
url: '',
},
]
-->
<vue-slide :items='banners' :itemImageKey='img' :itemLinkKey='url'></vue-slide>
Props
| Name |
Type |
Default |
Description |
| items |
Array |
[] |
Items to be render in the Slide |
| itemImageKey |
String |
'image' |
Image key of items to show client |
| itemLinkKey |
String |
'link' |
Link key of items to show client |
| timeout |
Number |
6000 |
Automatically changed item on timeout |
| isAuto |
Boolean |
true |
Whether used or not automatically changing item |
| isRepeat |
Boolean |
true |
Whether used or not repetition when reached last item. |
Next Update List
- Mobile Break point prop will be added for custom.
- Touch prop will be added for mobile touch.