vue 移动端轮播组件
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
build fix issue #8 Aug 31, 2017
config 支持非单文件组件用法 Jul 13, 2016
dist fix issue #8 Aug 31, 2017
docs fix issue #8 Aug 31, 2017
example fix issue #8 Aug 31, 2017
src fix issue #8 Aug 31, 2017
test/unit beta Jul 6, 2016
.babelrc 2.0 Feb 4, 2017
.editorconfig alpha Jul 5, 2016
.gitignore dist Jul 7, 2016
LICENSE Initial commit Jul 5, 2016
README.md update docs Feb 4, 2017
debug.log 2.0 Feb 4, 2017
package.json 2.0.1 Aug 31, 2017

README.md

vue-m-carousel

vue 移动端轮播组件 live demo

1.0 branch

NPM version npm download

##简介(Intro)

  • 移动端高性能轮播组件,体积只有 8.82 kB
  • 除了vue之外不依赖其他库
  • 动画通过 transform 和 translate 实现,布局通过flex实现
  • 支持响应式布局,也支持固定布局
  • 提供动画结束的回调

install

vue-m-carousel

npm install vue-m-carousel

用法

    <carousel :indicators="true" :auto="3000">
        <div v-for="i in 3">carousel-item-{{i-1}}</div>
    </carousel>
import Carousel from 'vue-m-carousel'
export default {
    components: {
        Carousel
    }
}

API(跟1.0版本一致)

props

name type default description
loop Boolean true 是否循环播放
auto Number 3000 是否自动播放,0不自动播放,其他值则自动播放,值为其自动播放的interval
indicators Boolean false 是否添加屏点,不带任何样式,样式可参考demo写
responsive Number 40 是否开启响应式高度,若为0则不开启,其他正整数表示 高度是宽度的百分之多少
flickThreshold Number 0.6 轻弹的最小速度
delta Number 100 滚动时触发滚动到下一张的最小值
onSlidEnd Function noop 轮播切换完成时的回调
preventDefault Boolean false 取消touchmove事件的默认动作