主要记录一下最近使用RN 0.29.2版本遇到的适配的坑以及部分警告的解法。

适配类:

  1. 安卓输入框圆角、边框颜色、粗细等无法设置成功,需要在TextInput外面新增一个View设置圆角,TextInput本身设置背景透明可以解决。
  2. lineHeight样式在安卓上不能为小数,否则崩溃。
  3. TextInput的editable属性设置之后即便为true,iOS的清空按钮也不能点。workaround:不设置editable,通过不更新state来限制输入。
  4. Text的numberOfLines设为0的话iOS不限行数,Android则不显示任何内容。可将该值设置为一个较大数如跟字数限制相等。
  5. Image的resizeMode设为stretch则安卓的borderRadius样式圆角针对的是图片的原始尺寸,设为cover则针对style中的高宽。iOS无此问题,均针对Image控件本身。
  6. ListView的onResponderMove事件在Android不触发,需要设置onMoveShouldSetResponderCapture, 若返回true则小米的ListView响应onResponderMove事件但三星仍然不行,但具体看业务可能可以用onMoveShouldSetResponderCapture取代onResponderMove来完成Android上的逻辑,返回false即可。onMoveShouldSetResponderCapture不影响iOS。
  7. KeyboardAvoidingView在iOS和Android上表现不尽相同,需要render不同的view hierarchy。具体请查看TweetCommentEdtor代码。另外在Android上若有TextInput会显示不正确,键盘会一直覆盖到TextInput输入区域下面(受到windowSoftInputMode属性影响)。详见FB的这条pull:https://github.com/facebook/react-native/pull/8889 , 另外下面有我的评论和解决方案(id:cmmobiraoxin)。

警告类:

  1. ListView的renderRow警告需要key,设置renderRow中的component的key属性是没用的,需要设置renderSeparator中的component的key属性。同样的往一个Array中push多个component,需要每个component都有key属性且不可重复。
  2. 新出的ActivityIndicator兼容iOS和Android,可以替换掉ActivityIndicatorIOS和ProcessBarAndroid。
  3. 使用Promise部分中的callback代码错误会变为警告。Promise的设计可以替代回调,因此应该将Promise返回给调用者,使其可以继续使用.then来进行后续处理和使用.catch来处理异常情况。

[原创]最近使用React-Native的适配问题和警告搜集的更多相关文章

  1. react native Expo适配全面屏/Expo识别全面屏和正常屏

    一.最新版本的expo已经默认支持了全面屏,即不会像react native cli一样出现底部黑边 二.但是全面屏通过Dimensions.get('window')获取的高度还是不准确,因为全面屏 ...

  2. [React Native]去掉WebStorm中黄色警告

    用WebStorm开发RN难免会碰到一大堆黄色警告.就像下面这样. 其实这个错误并不会影响开发,但是作为一个上升处女座的,我很难忍.于是各种想办法. 上网查了半天发现这篇文章 http://blog. ...

  3. React Native 开发豆瓣评分(五)屏幕适配方案

    前言 React Native 是以实际像素 dp 为单位的,这导致在不同分辨率的屏幕会有不一样的显示情况. 在原生 Android 中,可以根据不同的分辨率添加不同的样式目录,以解决不同分辨率的问题 ...

  4. React Native踩坑日记 —— tailwind-rn

    项目背景 在项目的初始阶段,我们需要建立自己的design system,我们spike了一些方案,tailwind-rn就是其中一种,如果有用到或者即将用到tailwind-rn的,可以进来看一看, ...

  5. React Native纯干货总结

    随着项目也渐渐到了尾声,之前的项目是mobile开发,采用的是React Native.为即将要开始做RN项目或者已经做过的小伙伴可以参考借鉴,也顺便自己做一下之前项目的总结. 文章比较长,可以选择自 ...

  6. 给所有开发者的React Native详细入门指南

    建议先下载好资料后,再阅读本文.demo代码和资料下载 目录 一.前言 二.回答一些问题 1.为什么写此教程 2.本文适合哪些人看 3.如何使用本教程 4.需要先学习JavaScript.HTML.C ...

  7. React Native不同设备分辨率适配和设计稿尺寸单位px的适配

    React Native中使用的尺寸单位是dp(一种基于屏幕密度的抽象单位.在每英寸160点的显示器上,1dp = 1px),而设计师使用的是px, 这两种尺寸如何换算呢? 官方提供了PixelRat ...

  8. React Native移动开发实战-4-Android平台的适配原理

    打开Android开发工具Android Studio,选择菜单 Open an existing AndroidStudio project,打开ch04项目的android文件夹,如图5.8所示. ...

  9. react native 入门实践

    上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.希望 ...

随机推荐

  1. quartz.net 时间表达式----- Cron表达式详解

    序言 Cron表达式:就是用简单的xxoo符号按照一定的规则,就能把各种时间维度表达的淋漓尽致,无所不在其中,然后在用来做任务调度(定时服务)的quart.net中所认知执行,可想而知这是多么的天衣无 ...

  2. Livecoding.tv2.5发布,增加“用户搜索引擎”功能,方便用户找到匹配的程序员

    近日,在Livecoding.tv最新发布的博客中,介绍了该平台2.5版的一系列新功能,其中的User Discovery Engine(用户搜索引擎)受到大家的欢迎.使用该引擎,可以很方便地查找在L ...

  3. ASP.NET MVC5+EF6+EasyUI 后台管理系统--系统模块部分图

    系统日志,系统异常,组织架构等

  4. 【项目记录】-液化气配送app android版

    15年底参与过甲方呼叫中心平台开发.液化气配送app android版要求1个月开发完成.开发此项目以前我只有过一周android的开发经验.(与甲方签署过保密协议,遵循职业道德有些敏感信息不能写.) ...

  5. Android官方文档

    下面的内容来自Android官方网站,由于访问这个网站需要FQ,不方便,所以我把部分内容copy下来了,不保证内容是最新的. Source Overview    Codelines, Branche ...

  6. Spring MVC学习

    SpringMVC框架 转载请注明出处 目录 一:配置springMVC开发环境 1.1.配置文件的helloworld 1.2.基于注解的helloworld 二:@RequestMapping详解 ...

  7. 如果你也会C#,那不妨了解下F#(6):面向对象编程之“类”

    前言 面向对象的思想已经非常成熟,而使用C#的程序员对面向对象也是非常熟悉,所以我就不对面向对象进行介绍了,在这篇文章中将只会介绍面向对象在F#中的使用. F#是支持面向对象的函数式编程语言,所以你用 ...

  8. Kafka无消息丢失配置

    Kafka到底会不会丢数据(data loss)? 通常不会,但有些情况下的确有可能会发生.下面的参数配置及Best practice列表可以较好地保证数据的持久性(当然是trade-off,牺牲了吞 ...

  9. 『.NET Core CLI工具文档』(六)dotnet 命令

    说明:本文是个人翻译文章,由于个人水平有限,有不对的地方请大家帮忙更正. 原文:dotnet command 翻译:dotnet 命令 名称 dotnet -- 运行命令行命令的一般驱动程序 概要 d ...

  10. .NET正则表达式基础入门(四)

    断言 判断某个位置左侧或者右侧是否符合匹配.常见断言有三种,单词边界.行起始/结束位置.环视.阅读本章前,建议先下载我于CSDN上传的示例代码,下载无需分数,下载链接. 1.单词边界 正则表达式&qu ...