react-native版本:0.61.1

react-native-swiper版本:1.5.14

当时第一次使用时候直接粘贴的别人博客的教程代码,只修改了swiper里面的元素,结果发现不能切换,点击下一张按钮,小圆点会跟着切换,但是元素却没有切换,一直保持在最后一张,折腾了半天,发现不能给Swiper元素的style里加width属性,高宽是直接被当做Swiper的属性赋予的

             <Swiper
style={styles.wrapper}
showsButtons={true}
removeClippedSubviews={false} //这个很主要啊,解决白屏问题
autoplay={true}
horizontal ={true}
autoplayTimeout = {4}
loop = {true}
>
<Image source={{uri:'http://p1.music.126.net/DBN-pGDTN2_LPDnyCYonMA==/109951164474447712.jpg'}} style={styles.bannerImg} />
<Image source={{uri:'http://p1.music.126.net/5lcR4NT8Mu-CBQnpBTqn7w==/109951164474482743.jpg'}} style={styles.bannerImg} />
<Image source={{uri:'http://p1.music.126.net/krcK1qrj6fdcZ28DkXJlWw==/109951164474509253.jpg'}} style={styles.bannerImg} />
<Image source={{uri:'http://p1.music.126.net/YANzhLtF9LpgF17vuUHJ7g==/109951164475251428.jpg'}} style={styles.bannerImg} />
</Swiper>
wrapper:{
width:width * 0.9,//这行不能加
height:200,
backgroundColor:'red',
zIndex:10000,
overflow:'scroll'
},
bannerImg:{
width:width * 0.9,
height:200,
}

react-native-swiper使用时候的小坑的更多相关文章

  1. 第一个React Native程序踩到的那些坑

    毫不夸张的说用React Native写一个Hello World !程序是我碰到最复杂的Hello World.网络上的有关的环境搭建相关的文档也很多,但是总是有这样那样的问题. 官方中文版的安装文 ...

  2. 移动端学习之理解WEB APP、Native APP、Hybrid APP以及React Native/uniapp包括H5、小程序等的区别与共通之处

    因为工作需要,需要进一步了解移动端的开发,遂返回复习移动端的知识点,在开始学习之前,产生了疑惑WEB APP .Native APP .Hybrid APP.React Native.Uniapp.H ...

  3. React Native底|顶部导航使用小技巧

    导航一直是App开发中比较重要的一个组件,ReactNative提供了两种导航组件供我们使用,分别是:NavigatorIOS和Navigator,但是前者只能用于iOS平台,后者在ReactNati ...

  4. React Native顶|底部导航使用小技巧

    导航一直是App开发中比较重要的一个组件,ReactNative提供了两种导航组件供我们使用,分别是:NavigatorIOS和Navigator,但是前者只能用于iOS平台,后者在ReactNati ...

  5. React Native 生命周期及相关方法小技巧使用

    ES6 生命周期图解 很多文章里的图解,第一步是 getDefaultProps , 第二步是 getinitialstate ,这是 ES5 的写法; 实际上ES6 中 getinitialstat ...

  6. 在 React Native 中使用 Redux 架构

    前言 Redux 架构是 Flux 架构的一个变形,相对于 Flux,Redux 的复杂性相对较低,而且最为巧妙的是 React 应用可以看成由一个根组件连接着许多大大小小的组件的应用,Redux 也 ...

  7. react native window下的环境搭建和调试方案

    这几天使用react native开发app,遇到一些坑,先记录下来,以后再继续补充 环境搭建 打开react native中文网,发现环境搭建特么也太复杂了,安装各种插件/软件,对于我们 编辑器+浏 ...

  8. React Native工作小技巧及填坑记录

    以下是本人在React Native开发工作中使用的一些小技巧,记录一下. 1.从网络上拉取下来的React Native缺少React和React Native库. 终端 1. cd 项目根目录 2 ...

  9. React Native填坑之旅 -- 回归小插曲

    回归RN,非常开心啊! 在React Native 0.49.5上开发,直接遇到一个ios模拟器的问题.这个问题很简单就是Bundle URL not present. 在网上找了很多的解决方法,都不 ...

  10. React Native 填坑一

    React Native 填坑一 关于RN的布局 分为主轴和交叉轴, 主轴可以是横向也可以是竖向,交叉轴也是对应的. 主轴默认是竖向.如果要更改用flexdirection 主轴对齐方式:justif ...

随机推荐

  1. 如何在Liferay 7中创建一个简单的JSF Portlet

    这个将在Liferay IDE 3.1 M3的发布版中提供创建的选项,但是你也可以通过命令行来创建. 1.这是Liferay JSF团队的官网:http://liferayfaces.org/ 你能在 ...

  2. <> 是不等号的意思

    <> 是不等号的意思,也有的语言可以写作:#  或者 != 1.=表示 等于: 2.<> 表示不等于:(注释:在 SQL 的一些版本中,该操作符可被写成 !=): 3.> ...

  3. Selenium-----wait的三种等待

    在UI自动化测试中,必然会遇到环境不稳定,网络慢的情况,这时如果你不做任何处理的话,代码会由于没有找到元素,而报错.这时我们就要用到wait(等待),而在Selenium中,我们可以用到一共三种等待, ...

  4. 【JZOJ4854】【NOIP2016提高A组集训第6场11.3】小澳的坐标系

    题目描述 小澳者表也,数学者景也,表动则景随矣. 小澳不喜欢数学,可数学却待小澳如初恋,小澳睡觉的时候也不放过. 小澳的梦境中出现了一个平面直角坐标系,自原点,向四方无限延伸. 小澳在坐标系的原点,他 ...

  5. python 局部变量

  6. HZOJ trade

    强烈谴责$skyh$的没$\Huge 脸$行为. 很经典的可反悔贪心,然而我一直以为是sbdp还一直想着怎么优化…… 正常的贪心肯定是不对的. 但是由于A-C=A-B+B-C, 所以用一个小根堆维护, ...

  7. Python基础:16面向对象概述

    1:在版本2.2 中,Python社区最终统一了类型(type)和类(class),新式类具备更多高级的OOP特性,扮演了一个经典类(旧式类)超集的角色,后者是Python 诞生时所创造的类对象. 2 ...

  8. oracle函数 VSIZE(X)

    [功能]返回X的大小(字节)数 [参数]x select vsize(user),user from dual; 返回:6 asdied select length('adfad合理') " ...

  9. 模板—tarjan求割边

    int dfn[MAXN],low[MAXN],cnt; void tarjan(int x,int edg) { low[x]=dfn[x]=++cnt; for(int i=f(x);i;i=n( ...

  10. AUTOSSH设置ssh隧道,实现反向代理访问内网主机

    内网主机上配置: autossh -M -CNR :localhost: ubuntu@123.207.121.121 可以实现将访问主机123.207.121.121的1234端口的数据,通过隧道转 ...