1.首先在react项目中引入antd-mobile UL组件库 ，在本地项目终端
npm install antd-mobile
2.在需要的页面中引入该组件
import { Carousel } from 'antd-mobile'
3.图片中的数据来源于接口，就说一下axios的使用，在本地终端 npm install axios
在该页面中引入
import axios from 'axios';
4.在state中定义一个存放轮播图数据的数组，对数据的一个初始化
5.在生命周期函数componentDidMount()中请求接口数据，取出后在setState中把回调函数中返回的数据赋给swiperList
6.渲染数据到改组件上
其中组件属性中 autoplay为是否自动播放，infinite为是否为自动播放，这里默认为true,下面通过map方法遍历swiperList，对每一个对象进行设置，图片地址中的baseUrl，为请求初始化时的一个起始地址
也可以把这段地址直接拼上构成图片的服务端地址，最后在onload中更新图片的样式。
7.最终效果
这篇文章内容虽然简单但也比较实用，希望能帮助到大家。
