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.