zdm-vue-sliders v1.0.1

vue-sliders

vue轮播图组件 测试插件发布功能专用 仅供内部参考

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

参数配置

data：传入一个数组，包含一个或多个对象，每个对象包含图片地址和链接跳转地址，必选 interval：轮播动画时间，可选（默认3000ms） target：链接跳转方式，可选（默认_self） width：轮播图宽度，可选（默认800px） height：轮播图高度，可选（默认400px） name：轮播图切换动画模式，有左右滑动（move）和淡入淡出（fade）两种动画切换模式，可选（默认move）

实例

首先在项目的入口文件（main.js）中引入

import Slider from 'zdm-vue-sliders'
Vue.use(Slider) 

然后使用该组件

<Slider :sliders="sliders"  />

sliders: {
        data: [
          {
            src: '', //图片地址
            url: '' //链接跳转地址
          }
        ],//传入图片地址和链接跳转地址，必选
        interval: 3000, //轮播动画时间，可选（默认3000ms）
        target: '_blank', //跳转方式，可选（默认_self）
        width:"1200px",//图片宽度，可选（默认800px）
        height:"600px",//图片高度，可选（默认400px）
        name: 'fade' //轮播图动画方式，可选（默认move）
      } 

For detailed explanation on how things work, consult the docs for vue-loader.