[原创]最近使用React-Native的适配问题和警告搜集
主要记录一下最近使用RN 0.29.2版本遇到的适配的坑以及部分警告的解法。
适配类:
- 安卓输入框圆角、边框颜色、粗细等无法设置成功,需要在TextInput外面新增一个View设置圆角,TextInput本身设置背景透明可以解决。
- lineHeight样式在安卓上不能为小数,否则崩溃。
- TextInput的editable属性设置之后即便为true,iOS的清空按钮也不能点。workaround:不设置editable,通过不更新state来限制输入。
- Text的numberOfLines设为0的话iOS不限行数,Android则不显示任何内容。可将该值设置为一个较大数如跟字数限制相等。
- Image的resizeMode设为stretch则安卓的borderRadius样式圆角针对的是图片的原始尺寸,设为cover则针对style中的高宽。iOS无此问题,均针对Image控件本身。
- ListView的onResponderMove事件在Android不触发,需要设置onMoveShouldSetResponderCapture, 若返回true则小米的ListView响应onResponderMove事件但三星仍然不行,但具体看业务可能可以用onMoveShouldSetResponderCapture取代onResponderMove来完成Android上的逻辑,返回false即可。onMoveShouldSetResponderCapture不影响iOS。
- KeyboardAvoidingView在iOS和Android上表现不尽相同,需要render不同的view hierarchy。具体请查看TweetCommentEdtor代码。另外在Android上若有TextInput会显示不正确,键盘会一直覆盖到TextInput输入区域下面(受到windowSoftInputMode属性影响)。详见FB的这条pull:https://github.com/facebook/react-native/pull/8889 , 另外下面有我的评论和解决方案(id:cmmobiraoxin)。
警告类:
- ListView的renderRow警告需要key,设置renderRow中的component的key属性是没用的,需要设置renderSeparator中的component的key属性。同样的往一个Array中push多个component,需要每个component都有key属性且不可重复。
- 新出的ActivityIndicator兼容iOS和Android,可以替换掉ActivityIndicatorIOS和ProcessBarAndroid。
- 使用Promise部分中的callback代码错误会变为警告。Promise的设计可以替代回调,因此应该将Promise返回给调用者,使其可以继续使用.then来进行后续处理和使用.catch来处理异常情况。
[原创]最近使用React-Native的适配问题和警告搜集的更多相关文章
- react native Expo适配全面屏/Expo识别全面屏和正常屏
一.最新版本的expo已经默认支持了全面屏,即不会像react native cli一样出现底部黑边 二.但是全面屏通过Dimensions.get('window')获取的高度还是不准确,因为全面屏 ...
- [React Native]去掉WebStorm中黄色警告
用WebStorm开发RN难免会碰到一大堆黄色警告.就像下面这样. 其实这个错误并不会影响开发,但是作为一个上升处女座的,我很难忍.于是各种想办法. 上网查了半天发现这篇文章 http://blog. ...
- React Native 开发豆瓣评分(五)屏幕适配方案
前言 React Native 是以实际像素 dp 为单位的,这导致在不同分辨率的屏幕会有不一样的显示情况. 在原生 Android 中,可以根据不同的分辨率添加不同的样式目录,以解决不同分辨率的问题 ...
- React Native踩坑日记 —— tailwind-rn
项目背景 在项目的初始阶段,我们需要建立自己的design system,我们spike了一些方案,tailwind-rn就是其中一种,如果有用到或者即将用到tailwind-rn的,可以进来看一看, ...
- React Native纯干货总结
随着项目也渐渐到了尾声,之前的项目是mobile开发,采用的是React Native.为即将要开始做RN项目或者已经做过的小伙伴可以参考借鉴,也顺便自己做一下之前项目的总结. 文章比较长,可以选择自 ...
- 给所有开发者的React Native详细入门指南
建议先下载好资料后,再阅读本文.demo代码和资料下载 目录 一.前言 二.回答一些问题 1.为什么写此教程 2.本文适合哪些人看 3.如何使用本教程 4.需要先学习JavaScript.HTML.C ...
- React Native不同设备分辨率适配和设计稿尺寸单位px的适配
React Native中使用的尺寸单位是dp(一种基于屏幕密度的抽象单位.在每英寸160点的显示器上,1dp = 1px),而设计师使用的是px, 这两种尺寸如何换算呢? 官方提供了PixelRat ...
- React Native移动开发实战-4-Android平台的适配原理
打开Android开发工具Android Studio,选择菜单 Open an existing AndroidStudio project,打开ch04项目的android文件夹,如图5.8所示. ...
- react native 入门实践
上周末开始接触react native,版本为0.37,边学边看写了个demo,语法使用es6/7和jsx.准备分享一下这个过程.之前没有native开发和react的使用经验,不对之处烦请指出.希望 ...
随机推荐
- MySql 管理操作常用命令
登陆mysql mysql -u username -p 创建用户名配置权限,这里为该用户配置tablename表的全部权限,也可以指定 GRANT ALL PRIVILEGES ON databas ...
- JavaScript -Array.form方法
Array.from方法可以把一个类数组或者课遍历对象转换为一个正真的数组 语法 Array.from(arrayLike[, mapFn[, thisArg]]) 参数 arrayLike 想要转换 ...
- Oracle数据库文件路径变更
环境:RHEL 6.4 + Oracle 11.2.0.3 情景一:只是部分普通数据文件迁移,可以在线操作. 1.将对应表空间offline,移动数据文件到新路径 2.数据文件alter databa ...
- Oracle 11.2.0.4 DataGuard 环境打PSU,OJVM PSU补丁快速参考
环境:RHEL6.5 + Oracle 11.2.0.4 DataGuard physical standby 主库和备库都是单节点. 需求:主备库同时应用160719的PSU和OJVM PSU补丁. ...
- RHEL 本地yum源配置
1.创建挂载目录 # mkdir -p /media/cdrom 2.挂载对应系统版本的iso光盘镜像文件 # mount -o loop -t iso9660 /opt/rhel-server- ...
- SQL实用
实用的SQL语句 行列互转 create table test(id int,name varchar(20),quarter int,profile int) insert into test ...
- Federated Identity Pattern 联合身份模式
Delegate authentication to an external identity provider. This pattern can simplify development, min ...
- css3新单位学习
vw,vh,vmin,vmax vw 1vw = 视窗width*1% vh 1vh = 视窗heihgt*1% 如果视窗的宽度小于高度,1vmin = 1vw,如果视窗宽度大于高度,1vmin = ...
- angularjs和ajax的结合使用 (二)
今天我们来继续丰富上次的例子.我们来搞些 稍微复杂点的应用. 首先我们来加一个全选 的功能. 上一篇的例子里我们看到 分页时载入的是我们通过linq 查询自定义列 然后构建的匿名类 .使用这种EF框架 ...
- STM32 NVIC配置详解
例程: /* Configure one bit for preemption priority */ NVIC_PriorityGroupConfig(NVIC_PriorityGroup_1) ...