tnt-swiper

#tnt-swiper

react banner幻灯片组件

#Development npm i && npm test

#Usage

var TntSwiper = require('tnt-swiper');
var React = require('react');  
var ReactDOM = require('react-dom');   
const images = [
    {
        src : "http://tupian.qqjay.com/u/2017/0103/2_234332_2.jpg"
    },
    {
        src : "http://tupian.qqjay.com/u/2017/0103/2_234332_2.jpg"
    },
    {
        src : "http://tupian.qqjay.com/u/2017/0103/2_234332_2.jpg"
    },
    {
        component : <div className="test"><p>11111</p></div>
    }
]
ReactDOM.render(
    <TntSwiper 
        images={images}
    />

, document.getElementById('app'));

#API

##props

| name           | type                             | default    | description                          |
| pagination     | bool                             | true       | 是否显示分页器                       |
| paginationType | string                           | bullets    | 分页器样式 bullets/fraction/progress |
| style          | object                           | {}         | 组件容器样式                         |
| onChange       | function(val:number)             |            | 滑动结束事件                         |
| prefixCls      | string                           | tnt-switch | 样式前缀用于重写样式                 |
| startSlide     | number                           | 0          | 初始化页数                           |
| onClick        | function(val:number)             |            | 点击事件                             |
| transitionEnd  | function(val:number,ele:element) |            | 滑动动画结束事件                     |
| images         | array                            |            | 图片 [{src:图片,component:组件}...]            |
| speed          | number                           | 300        | 动画速度                             |
| auto           | number                           | 7000       | 动画自动播放速度 0为不自动播放       |
| loop           | bool                             | true       | 是否循环                             |