@@ -46,4 +46,55 @@ class Example extents Component{
4646 },
4747};
4848export default Example ;
49-
49+ ```
50+ ###Config Props:
51+ ``` javascript
52+ Index .PropTypes = {
53+ index: PropTypes .number ,// 初始值
54+ height: PropTypes .oneOfType ([// 容器的高度
55+ PropTypes .number ,
56+ PropTypes .string
57+ ]).isRequired ,
58+ duration: PropTypes .number ,// 动画完成周期
59+ distance: PropTypes .number ,// 触发切换的距离
60+ loop: PropTypes .bool ,// 是否循环播放
61+ autoPlay: PropTypes .bool ,// 是否自动播放
62+ interval: PropTypes .number ,// 轮播间隔秒数
63+ type: PropTypes .string ,// 轮播类型 默认支持animateType
64+ typePro: PropTypes .bool ,// 需要同屏显示3个slide的时候设置为true. 例如type设置成 animatetype.CARD时
65+ pagination: PropTypes .bool ,// 是否显示分页
66+ onSlideChange: PropTypes .func ,// slide切换回调
67+ createStyle: PropTypes .func // 样式生成器,可自行传入
68+ };
69+ // 样式生成器是一个纯函数。用于返回上一,当前,下一slide的样式。默认animateTypes.DEFAULT的配置如下:
70+ export default (animateTypes ,stage ,progress ,duration )=> {// 接收参数依次为动画类型,slide状态,滑动距离,动画执行时间
71+ switch (animateTypes){
72+ case animateTypess .DEFAULT :
73+ switch (stage){
74+ case ' pre' :
75+ return (
76+ {
77+ transform: ` translateX(${ - (clientWidth+ progress)} px)` ,
78+ transitionDuration: ` ${ duration} s`
79+ }
80+ );
81+ case ' active' :
82+ return (
83+ {
84+ transform: ` translateX(${ - progress} px)` ,
85+ transitionDuration: duration+ " s"
86+ }
87+ )
88+ case ' next' :
89+ return (
90+ {
91+ transform: ` translateX(${ (clientWidth- progress)} px)` ,
92+ transitionDuration: duration+ " s"
93+ }
94+ )
95+ default :
96+ break ;
97+ }
98+ break ;
99+ default :break ;
100+ }