react-native 轮播图 ——react-native-swiper使用

今天学习了轮播图的使用,上网查阅了一下,发现有react-native-swiper和React-Native-Viewpager(https://blog.csdn.net/zhukui66/article/details/51077592)两种封装的比较好的第三方组件,对比了下文档,觉得react-native-swiper功能更加完善,而且文档说明比较全面,所以只用了react-native-swiper,下面介绍下react-native-swiper的使用。该组件同时支持android和iOS。
react-native-swiper的github地址

使用说明:

  1. 先安装React-native-swiper
    npm install react-native-swiper --save
  2. 导入Swiper
    import Swiper from ‘react-native-swiper’;
    3.使用Swiper

    
    
    


const styles = StyleSheet.create({

    swiper: {},
    img: {
        width: dimensions.width,
        height: 200,
    }
});

4.相关属性和方法介绍

}
    activeDot={}

>
    
    
    

react-native 轮播图 ——react-native-swiper使用_第1张图片
image.png

react-native 轮播图 ——react-native-swiper使用_第2张图片
image.png

react-native 轮播图 ——react-native-swiper使用_第3张图片
image.png

react-native 轮播图 ——react-native-swiper使用_第4张图片
image.png

你可能感兴趣的:(react-native 轮播图 ——react-native-swiper使用)