@aidol/vue-slideshow v0.1.9

@aidol/vue-slideshow

a slideshow component for vue.js

Installation

Using npm

npm install @aidol/vue-slideshow --save
#or
cnpm install @aidol/vue-slideshow --save

Usage

In main.js

import Vue from 'vue'
import AiSlideshow from '@aidol/vue-slideshow'

Vue.use(AiSlideshow)

// new Vue({ //... })

In_.vue

<ai-slideshow :data="imgList" @jump="jumpTo" />

export default {
  name: "demo",
  data(){
    return {
      imgList: [
        // the object must have `src` property
        // `title` : img 's title
        // `src` : img 's src
        {title: "defalut" , src: "./images/1.jpg"},
        {title: "defalut2" , src: "./images/2.jpg"},
        // ...
      ]
    }
  },
  methods: {
    jumpTo(){
      // do somethig when you click the img ...
    }
  }
}

Properties

注意: 1. :data prop 必须是对象数组类型，且该对象中必须包含 src 字段 （图片地址）

Events

@jump

点击某张图片时触发句柄

<ai-slideshow @jump="jumpTo" />

export default {
  name: "demo",
  data(){
    return {}
  },
  methods: {
    jumpTo(info){
      // `info` is the data of current img
      // do somethig when you click the img ...
    }
  }
}

Logs

2018/9/4