tip
React 刚出来不久,组件还比较少,不像 jquery 那样已经有很多现成的插件了,当是就自己写了一个基于 React 的轮播组件,当然只是一个小 demo,刚刚有用 es6 的语法重新改了改,就想着写一个小教程给新手,如何实现一个 React 的小组件。
先放上仓库地址,可以先 clone 来看看代码:https://github.com/TongchengQiu/react-slider。
react-slider 是一个图片轮播的组件,支持的配置有 图片(必须好不好,要不然轮播毛)、轮播图片的速度、是否自动轮播、自动轮播的时候鼠标放上去是否暂停、自动轮播速度、是否需要前后箭头、是否需要 dot (我不知道怎么表述好,反正意思你懂)。
第一步 需求
首先,写一个组件必须先考虑改组件的需求有哪些,支持的配置需要哪些。
如上已经说了改组件的需求:
轮播的图片
配置轮播图片切换的速度
可配置是否自动轮播
可配置自动轮播的时候鼠标放上去是否暂停
可配置自动轮播的速度
可配置是否需要前后箭头
可配置是否需要 dot (我不知道怎么表述好,反正意思你懂)
这一步先到此为止~~~
第二步 构建项目
这里我们是使用 React 框架,当然也是用它的好搭档 webpack 来构建自动化流程咯~ 原文链接:https://www.f2er.com/react/307196.html