美文网首页
React Native 那些坑

React Native 那些坑

作者: 小王子称号发放NPC | 来源:发表于2018-05-16 08:27 被阅读0次

    刚开始接触react-native小白一个,据说react可以跨平台就拿来试一下,结果不试不知道,一试全是坑!!特此记录一些没有baidu到太好的解决方案的坑,即大家都懂的!!

    1、React Native version mismatch(Android)

    本来用的好好的,突然就变成这个样子了,这是因为Android studio 选取了最新的react native版本,详见build.gradle,你会发现这样几行配置:

    dependencies {

        compile fileTree(dir: "libs", include: ["*.jar"])

        compile "com.android.support:appcompat-v7:23.0.1"

        compile "com.facebook.react:react-native:+"  // From node_modules

    }

    问题就出现在 compile "com.facebook.react:react-native:+"这一行,所以只要把版本改为你使用的版本号就可以了,如下:

    dependencies {

        compile fileTree(dir: "libs", include: ["*.jar"])

        compile "com.android.support:appcompat-v7:23.0.1"

        compile ("com.facebook.react:react-native:0.51.0") { force = true } // From node_modules

    }

    2、error Received malformed response from registry for undefined. The registry may be down.

    删除yarn,删除方法:cd /usr/local/bin   rm yarn

    3、Unexpected end of JSON input while parsing near...

    npm config set registry http://registry.cnpmjs.org 将淘宝的代理设回去,不要用淘宝代理就好,原因未知。

    4、RN:0.55,IOS真机设备无法连接进行调试,会报错:"Remote JS Debugger"-option gives"Connection timed out" on real device (iOS) ,但是在模拟器上可以

    引起这个问题的原因可能是和IOS证书绑定的APPID有关系,不要使用XCODE自动生成APPID的方式,使用现有(或是重新新建证书并绑定APPID)证书已存在的APPID进行签名,即Bundle Identifier填写所使用的签名 证书中存在的APPID,然后重新编译即可

    5、Can't find variable: Symbol

    在使用mobx进行数据管理时,有一版会有Can't find variable: Symbol 这种问题,最后发现是mobx版本问题,最后将"mobx": "^4.1.0","mobx-react": "^5.0.0",设定为这两个版本

    6、React-Native 与IOS通信,之传递参数

    只说一下怎么传递NSDictionary:

    RCT_EXPORT_MODULE();

    RCT_REMAP_METHOD(GetCSVFileContent,

                     paramater:(NSDictionary*)param

                     resoler:(RCTPromiseResolveBlock)resolve

                     rejecter:(RCTPromiseRejectBlock)reject)

    {  }

    7、React-Native与Android通信,之传递参数

    @ReactMethod

    public void GetCSVFileContent(ReadableMap param, Promise promise)

    {

    String year = param.getString("year");

    String month = param.getString("month");

    String type = param.getString("type");

    System.out.println("year="+year+"month="+month+"type="+type);

    /*

    HashMap newMap =

    Iterator iter = newMap.entrySet().iterator();

    while (iter.hasNext()) {

    Map.Entry entry = (Map.Entry) iter.next();

    Object key = entry.getKey();

    Object val = entry.getValue();

    System.out.println("收到的参数key="+key+"value="+val);

    }

    */

    }

    8、react-navigation在Android中headerTitle不居中的问题("react-navigation": "^1.5.7")

    经查阅资料需要修改两个地方:

    一、react-navigation/src/header/header.js

    if (Platform.OS ==='android') {

    if (!options.hasLeftComponent) {

    // style.left = 0;

      }

    if (!options.hasRightComponent) {

    //style.right = 0;

      }

    }

    二、react-navigation/src/header/header.js

    justifyContent: Platform.OS ==='ios' ?'center' :'center'

    都修改为以上就可以了

    9、React Native version mismatch(IOS)

    我是因为打开了之前运行了的shell窗口,导致出现在IOS中,解决方法就是关掉所有shell窗口,重新执行run-ios

    相关文章

      网友评论

          本文标题:React Native 那些坑

          本文链接:https://www.haomeiwen.com/subject/yybudftx.html