很好用的一个vue插件儿，留存一下。代码就直接搬过来了，附带个官方链接。
一、安装
npm install vue-concise-slider --save
二、启用
<template>
<!-- Make a div wrapped slider,set height and width -->
<div style="100%;margin:20px auto;height:400px">
<!-- Using the slider component -->
<slider ref="slider" :options="options">
<!-- slideritem wrapped package with the components you need -->
<slideritem v-for="(item,index) in someList" :key="index" :style="item.style">{{item.html}}</slideritem>
<!-- Customizable loading -->
<div slot="loading">loading...</div>
</slider>
</div>
</template>
<script>
// import slider components
import { slider, slideritem } from 'vue-concise-slider'
export default {
el: '#app',
data () {
return {
//data list [array]
someList:[
{
html: 'slide1',
style: {
'background': '#1bbc9b'
}
},
{
html: 'slide2',
style: {
'background': '#4bbfc3'
}
},
{
html: 'slide3',
style: {
'background': '#7baabe'
}
}
],
//Slider configuration [obj]
options: {
currentPage: 0
}
}
},
components: {
slider,
slideritem
}
}
</script>
三、链接