高度随每片内容的高度变化的swiper    
react-native-unfixed-height-swiper

内容可以文本 图片 视频

本例里面的为文本

使用方式
1. npm i react-native-unfixed-height-swiper --save-dev
2. 给组件传入文本数组,每个元素为对象{contents:'',name:''} 即可
3. detailPlots:[{index : 0,name : '填补中',contents : '由于作者过于懒惰 '},
                        {index : 1,name : '填补中',contents : '由于作者过于懒惰 '},
                        {index : 2,name : '填补中',contents : '由于作者过于懒惰'}]
 
4. <DetailSwiper detailPlotNumber={this.state.detailPlotNumber} detailPlots={this.state.detailPlots} />

欢迎pull request

性能不错

推荐将代码直接插入自己项目中 而不是require
这是因为要刷新 放入项目中的话 刷新会快很多

因为是父子组件  如果想跳过初始的默认数据阶段  就将@/lib/detailPlots的代码放入项目中  这样能很快的加载数据

github地址:
https://github.com/raintoway/react-native-unfixed-height-Swiper/tree/master/react-native-unfixed-height-Swiper
————————————————
版权声明:本文为CSDN博主「qq_41590147」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_41590147/article/details/103198957

高度随每片内容的高度变化的swiper react-native-unfixed-height-swiper的更多相关文章

  1. Android 让GridView的高度为Wrap_content根据内容自适应高度

    From:http://www.jayway.com/2012/10/04/how-to-make-the-height-of-a-gridview-wrap-its-content/ 如果把Grid ...

  2. Header 与 Footer 的 DIV 高度固定, 中间内容 DIV高度自适应,内容不满一页时,默认填满屏幕。

    一.需求: 页面布局分三大块: Header Body Footer 1.内容不满一页时,Footer 在屏幕最底部,Body 填充满 Header 与 Footer 中间的部分. 2.当缩小浏览器时 ...

  3. textarea高度自适应,随着内容增加高度增加

    $(function(){        $.fn.autoHeight = function(){            function autoHeight(elem){             ...

  4. div 初始高度,并随内容高度变化

    前几天做个邮箱系统,其中在内容的div设置了高度为200px; 可是在内容大于200高度后就出现了内容的溢出. 如图: 查完资料够才知道css有个min-height; 设置div的初始化高度,设置属 ...

  5. iframe高度自动随着子页面的高度变化而变化(不止要在iframe标签里加上this.height=this.contentWindow.document.body.scrollHeight)

    最近使用iframe整合页面遇到一些难题,走了很多弯路才解决,借此记录一下: 1 <!-- 页面主体内容 --> 2 <div class="iframe-wrapper& ...

  6. Jquery实现textarea根据文本内容自适应高度

    本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...

  7. iOS 动态计算文本内容的高度

    关于ios 下动态计算文本内容的高度,经过查阅和网上搜素,现在看到的有以下几种方法: 1. //  获取字符串的大小  ios6 - (CGSize)getStringRect_:(NSString* ...

  8. 设置UILabel可变高度(根据文本内容自动适应高度)

    @property(nonatomic)UILabel *showLabel;   // 计算文本所占高度,计算出来之后设置label的高度 // 第一个参数:字体大小,字体大小/样式影响计算字体的高 ...

  9. 设置DIV根据内容自动调整高度的三个方法

    Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid=&qu ...

随机推荐

  1. 不要在 MySQL 中使用“utf8”,请使用“utf8mb4”

    不要在 MySQL 中使用“utf8”,请使用“utf8mb4” 最近我遇到了一个bug,我试着通过Rails在以“utf8”编码的MariaDB中保存一个UTF-8字符串,然后出现了一个离奇的错误: ...

  2. TinyMCE入门

    引入TinyMCE脚本 <script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" ...

  3. QT绘制B样条曲线

    ²  贝塞尔曲线 贝塞尔曲线是通过一组多边折线的各顶点来定义.在各顶点中,曲线经过第一点和最后一点,其余各点则定义曲线的导数.阶次和形状.第一条和最后一条则表示曲线起点和终点的切线方向. ²  B样条 ...

  4. Centos7允许使用密码登录

      现在使用云主机比较多,所以一般都是使用秘钥登录,当做一个集群的时候需要几台机器之间免密登录时,就需要修改他的配置文件了,刚做运维那会儿,很熟练,现在忘得差不多了,特此记录一下,下次又这个需求时就不 ...

  5. JS引擎是如何工作的?从调用堆栈到Promise

    摘要: 理解 JS 引擎运行原理. 作者:前端小智 原文:JS引擎:它们是如何工作的?从调用堆栈到Promise,需要知道的所有内容 Fundebug经授权转载,版权归原作者所有. 为了保证可读性,本 ...

  6. pip requirements.txt

    生成文件 pip freeze > requirements.txt 依赖库会导到于requirements.txt 比如:   image.png 从requirements.txt安装依赖库 ...

  7. phpstorm分别在Mac和Windows下启动命令行,并启用ssh

    Mac:在terminal下运行 sudo -i 输入密码  就可以用ssh IP:端口  命令行登录了 DAssist是一个命令行开发辅助,可直接在系统命令行工具中使用,Linux和MacOS等自带 ...

  8. Java实现Redis的消息订阅和发布

    1.  首先需要一个消息监听器类 package com.sogou.baike.testimport.testSubscribe; import redis.clients.jedis.JedisP ...

  9. DVWA之命令执行

    一.命令执行漏洞 命令执行漏洞是指可以随意执行系统命令,属于高危漏洞之一,也属与代码执行范围内,好比说一句话木马<?php@eval($_POST['cmd']);?> 二.分类: 1.代 ...

  10. 2. 代理模式(C++)

    1.介绍 代理模式:为其他对象提供一种代理以控制对这个对象的访问.这样实现了业务和核心功能分离. 在代理模式中,我们创建具有现有对象的对象,以便向外界提供功能接口.在某些情况下,一个对象不适合或者不能 ...