1.下载依赖

cnpm install react-native-swiper --save 

2.在组件中使用

import React, { Component } from 'react';
import { StyleSheet, View,Dimensions,Image} from 'react-native';
import Swiper from 'react-native-swiper';
export default class SideItem extends Component {
render(){
return(
<View style={styles.container}>
<Swiper
style={styles.swiper}
height={220}
horizontal={true}
autoplay={true}
paginationStyle={{bottom: 20}}
showsButtons={false}>
<Image source={require('../assets/images/1.png')} style={styles.img}/>
<Image source={require('../assets/images/2.png')} style={styles.img}/>
<Image source={require('../assets/images/3.png')} style={styles.img}/>
</Swiper>
</View>
)
}
} const styles = StyleSheet.create({
container: {
flex: 1
},
swiper: {},
img: {
width: Dimensions.width,
height: 200,
}
});

3.运行run-Android

react native 中使用swiper的更多相关文章

  1. React Native 中 CSS 的使用

    首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...

  2. react native中的欢迎页(解决首加载白屏)

    参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...

  3. React Native中的网络请求fetch和简单封装

    React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...

  4. [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势

    http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...

  5. [转] 在React Native中使用ART

    http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...

  6. react native中使用echarts

    开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...

  7. react native中一次错误排查 Error:Error: Duplicate resources

    最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验. 今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate ...

  8. 在React Native中,使用fetch网络请求 实现get 和 post

    //在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...

  9. 《React Native 精解与实战》书籍连载「React Native 中的生命周期」

    此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...

随机推荐

  1. Chap3:区块链的衍生技术[《区块链中文词典》维京&甲子]

  2. Java 输入/输出——处理流(ObjectIO)

    Object流:直接将Object流写入或读出. TestObjectIO.java transient关键字(英文名:透明的,可以用来修饰成员变量(实例变量),transient修饰的成员变量(实例 ...

  3. [knowledge][http] http

    关于,底层承载协议的规定. HTTP communication usually takes place over TCP/IP connections. The [], but other port ...

  4. Web Deploy远程部署配置图解

    原文链接:https://jingyan.baidu.com/album/642c9d34e614de644a46f783.html

  5. codechef Sum of Cubes 图论

    正解:图论+数学 解题报告: 先放个传送门QwQ 然后放下题目大意?就说给定简单图,无自环或重边,然后求(∑e[i][j])k,i,j∈S,S为点集的子集 然后因为k的取值只有[1,3],所以这里分类 ...

  6. 【PyQt5-Qt Designer】QSlider滑块

    QSlider滑块 QSlider简介 QSlider小部件提供了一个垂直或水平滑块. 滑块是控制有界值的经典控件.它允许用户沿水平或垂直凹槽移动滑块手柄,并将手柄的位置转换为合法范围内的整数值. Q ...

  7. nodejs 学习二, nodejs调试

    nodejs 调试,在官方文档(英文),常用的两种: 一个在chrome安装插件inspector 第二种利用编辑 这里我使用vscode编辑来调试. 主要是配置 launch.json(用vscod ...

  8. python获取指定目录下特定格式的文件名

    之前一直用windows下的bat脚本获取一个目录下的指定格式的文件名,如下所示: dir *.jpg /b/s > train.set pause 十分简单,将这个bat文件放到你想要获取文件 ...

  9. 【Python】【面试必看】Python笔试题

    前言 现在面试测试岗位,一般会要求熟悉一门语言(python/java),为了考验求职者的基本功,一般会出 2 个笔试题,这些题目一般不难,主要考察基本功.要是给你一台电脑,在编辑器里面边写边调试,没 ...

  10. VS2017使用Git进行源代码管理

    步骤一:将解决方案添加到源代码管理 步骤二:进入团队资源管理器 双击存储库项目进入Git操作页面. 步骤三:同步本地代码到远程仓库 选择同步功能 步骤四:发布代码到Git 点击之后输入你要发布的git ...