首先說一下我的ReactNative的版本是0.43.4,Android6.0(華為榮耀6Plus),以下遇到的坑,在最新版的RN中沒測(cè)試是否還存在,不過按照Facebook的團(tuán)隊(duì)習(xí)慣,我估計(jì)還是沒修復(fù)的。
一、Textinput
1、android下相同高度的輸入框高度比ios下高。
android平臺(tái)上,在padding沒指定時(shí),通過Toggle Inspector可以發(fā)現(xiàn)TextInput的padding明明是0(見下圖1),但實(shí)際并非如此,paddingVertical必須指定為0。


2、onContentSizeChange方法在初始化時(shí)會(huì)執(zhí)行一次,后面就再也不執(zhí)行,這樣要實(shí)現(xiàn)輸入框的自動(dòng)高度就無法實(shí)現(xiàn),只能通過在onChange方法中去實(shí)現(xiàn)
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)});
}
二、攝像頭與相冊(cè)讀取
android6.0及以上版本,在android/app/src/AndroidManifest.xml配置權(quán)限已不起作用,必須在代碼中做權(quán)限判斷
示例:
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('訪問相機(jī)授權(quán)');
? ? ? ? ? ? message= Di18n.tr('需要允許使用您的相機(jī)才可拍照');
? ? ? ? }
? ? ? ? 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){
? ? ? ? ? ? //有權(quán)使用了
? ? ? ? }else{
? ? ? ? ? ? Toast.show(Di18n.tr('您沒有授權(quán),無法使用相機(jī)'));
? ? ? ? }
? ? });
}
三、View的overflow:hidden和borderRadius同用時(shí),hold不住里面子component,所以當(dāng)要實(shí)現(xiàn)圖片圓角時(shí),只能對(duì)View里面的子Component圖片加borderRadius屬性。
BUG網(wǎng)址描述:
https://github.com/facebook/react-native/issues/3198
https://github.com/facebook/react-native/issues/8885