说明:本版本轮播图是根据网易云音乐PC播放器首页轮播图制作的。网易轮播的特别之处在于,如果滑动不相邻的两张图片,转场效果不是滑动转场,而是跳跃转场。这个原则与轮播布局的初始设计非常相关。.这个旋转木马是在纯反应环境中用es6编写的。通过对状态中的数组进行重组排列,使其与风格相匹配。没有依赖就可以实现轮播的效果。最终的效果就是将react组件的开放接口进行封装并发布。注:本文为正推,待开发完成后进行总结优化。1.建筑架构这方面的文章应该很多,我就不用过多介绍了。随便去github找个react脚手架搭建一个基本的项目框架。我使用的框架是dva框架的改进版。github上有很多react脚手架。建议选择一种进行改进。我用的那个可能不适合你。二、准备材料1、相同尺寸的图片4张以上。(我把这八张图命名为1-8)2.React环境3.网易云PC播放器3.开发先放第一张图和左右两边能看到的图片。初始的静态结构是这样的新手注意:如果你觉得代码很吸引眼球,less和es6语法会自己补上importReactfrom'react';从“./Slide.less”导入样式;classSlideextendsReact.Component{constructor(props){super(props);this.state={dir:[{name:'middle'},{name:'start'},{name:'normal'},{name:'normal'},{name:'normal'},{name:'正常'},{名称:'正常'},{名称:'结束'},],};}render(){const{dir}=this.state;return(
