首先说一下我的ReactNative的版本是0.43.4,Android6.0(华为荣耀6Plus),以下遇到的坑,在最新版的RN中没测试是否还存在,不过按照Facebook的团队习惯,我估计还是没修复的。
一、Textinput
1、android下相同高度的输入框高度比ios下高。
android平台上,在padding没指定时,通过Toggle Inspector可以发现TextInput的padding明明是0(见下图1),但实际并非如此,paddingVertical必须指定为0。
2、onContentSizeChange方法在初始化时会执行一次,后面就再也不执行,这样要实现输入框的自动高度就无法实现,只能通过在onChange方法中去实现
onTextShouldChange(event) {
lettext= event.nativeEvent.text;
//TODO:ANDROID上onContentSizeChange不生效,需要通过onChange来
if(Platform.OS=='android'){
this.onContentSizeChange(event);
}
}
onContentSizeChange(event) {
let hei=Math.max(event.nativeEvent.contentSize.height,22*scale);
this.setState({inputHei:Math.min(hei,136*scale)});
}
二、摄像头与相册读取
android6.0及以上版本,在android/app/src/AndroidManifest.xml配置权限已不起作用,必须在代码中做权限判断
示例:
import{
Platform,
PermissionsAndroid
} from'react-native';
....
requestPermission(pname){
if(Platform.OS=='ios'){
return true;
}
try{
let message='',title='';
if(pname==PermissionsAndroid.PERMISSIONS.CAMERA){
title= Di18n.tr('访问相机授权');
message= Di18n.tr('需要允许使用您的相机才可拍照');
}
const granted=awaitPermissionsAndroid.request(pname,{title,message});
if(granted===PermissionsAndroid.RESULTS.GRANTED) {
return true;
}else{
return false;
}
}catch(err) {
console.log('requestPermission err',err);
return false;
}
}
componentDidMount(){
this.requestPermission(this.permission).then((result)=>{
if(result){
//有权使用了
}else{
Toast.show(Di18n.tr('您没有授权,无法使用相机'));
}
});
}
三、View的overflow:hidden和borderRadius同用时,hold不住里面子component,所以当要实现图片圆角时,只能对View里面的子Component图片加borderRadius属性。
BUG网址描述:
https://github.com/facebook/react-native/issues/3198
https://github.com/facebook/react-native/issues/8885