[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$f-6888P22tQImnBhYEhRzNhkLVtVBg3VZg34NxYqJi_I":3},{"code":4,"message":5,"data":6},200,"成功",{"id":7,"createdAt":8,"title":9,"content":10,"summary":11,"image":12,"uid":13,"user":14,"categoryId":21,"category":22,"subCategoryId":24,"subCategory":25,"comments":27,"status":17,"reason":12,"notice":12,"visitCount":28,"commentCount":29,"keywords":30},44,"2024-01-30T11:42:39.516Z","React native开发中可能遇到的问题","1. android项目集成react native后，真机调试，如果进入react native界面崩溃，可以尝试以下命令：\n```\ncurl \"http://localhost:8081/index.android.bundle?platform=android\" -o \"android/app/src/main/assets/index.android.bundle\"\n```\n\n2. 真机调试\n将\n```\nNSURL *jsCodeLocation = [NSURL URLWithString:@\"localhost/index.ios.bundle?platform=ios\"];\n```\n改成：\n```\nNSURL *jsCodeLocation = [NSURL URLWithString:@\"http://192.168.199.111:8081/index.ios.bundle?platform=ios\"];\n```\n并开启dev server。\n\n3. 离线包\n在根目录下面执行（入口文件路径和名字根据实际情况修改）：\n```\nreact-native bundle --entry-file ReactComponent/index.js  --bundle-output index.ios.jsbundle --platform ios --dev false --assets-dest ./\n```\n将生成的main.jsbundle和assets加入到Xcode中（添加引用）\n在代码中改成：\n```\nNSURL *jsCodeLocation = [[NSBundle mainBundle] URLForResource:@\"main\" withExtension:@\"jsbundle\"];\n```\n\n```\nreact-native bundle --entry-file index.ios.js  --bundle-output main.jsbundle --platform ios --dev false --assets-dest ./\n```\n\n4. 如果执行了react-native link后，运行ios提示`native module can not be null`\n检查一下cocoapods中的react native库的引用\n```\n#'node_modules'目录一般位于根目录中\n# 但是如果你的结构不同，那你就要根据实际路径修改下面的`:path`\npod 'React', :path => '../node_modules/react-native', :subspecs => [\n    'Core',\n    'RCTText',\n    'RCTImage',\n    'RCTLinkingIOS',\n    'RCTSettings',\n    'RCTVibration',\n    'RCTActionSheet',\n    'RCTNetwork',\n    'RCTWebSocket', # 这个模块是用于调试功能的\n    # 在这里继续添加你所需要的模块\n  ]\n  # 如果你的RN版本 >= 0.42.0，请加入下面这行\n  pod \"Yoga\", :path => \"../node_modules/react-native/ReactCommon/yoga\"\n```\n\n5. Unrecognized font family ionicons\nCannot read property 'UIAppFonts' of null\n参考：\n> https://www.npmjs.com/package/react-native-vector-icons\n\n按照链接里面的步骤，采用cocoapods来进行修改\n第一步：在cocoapods中加入RNVecorIcons的引用；\n第二部：修改info.plist，加入字体的声明\n\n6. FAILURE: Build failed with an exception.\n> * What went wrong:\nA problem occurred configuring project ':app'.\n> Could not resolve all dependencies for configuration ':app:_debugApk'.\n   > A problem occurred configuring project ':react-native-vector-icons'.\n      > The SDK Build Tools revision (23.0.1) is too low for project ':react-native-vector-icons'. Minimum required is 25.0.0\n\n修改android/build.gradle中的\n```\ndependencies {\n    classpath 'com.android.tools.build:gradle:2.3.1'\n    classpath 'com.neenbedankt.gradle.plugins:android-apt:1.8'\n\n    // NOTE: Do not place your application dependencies here; they belong\n    // in the individual module build.gradle files\n}\n```\n为\n```\ndependencies {\n    classpath 'com.android.tools.build:gradle:2.2.3'\n    classpath 'com.neenbedankt.gradle.plugins:android-apt:1.8'\n\n    // NOTE: Do not place your application dependencies here; they belong\n    // in the individual module build.gradle files\n}\n```\n\n7. Error:The SDK Build Tools revision (23.0.3) is too low for project ':app'. Minimum required is 25.0.0\n在android／build.gradle中进行设置\n（参考：\nhttps://github.com/oblador/react-native-vector-icons/issues/428、\nhttp://stackoverflow.com/questions/41890659/errorthe-sdk-build-tools-revision-23-0-3-is-too-low-for-project-app-minim）\n\n```\nbuildscript {\n    repositories {\n        jcenter()\n    }\n    dependencies {\n        classpath 'com.android.tools.build:gradle:2.2.3'\n\n        // NOTE: Do not place your application dependencies here; they belong\n        // in the individual module build.gradle files\n//        classpath 'com.neenbedankt.gradle.plugins:android-apt:1.8'\n    }\n}\n\nallprojects {\n    repositories {\n        jcenter()\n    }\n}\n```\n\n如果不行的话，试试清除缓存。\n\n8. 向原生工程中引入react-native-vector-icons库的步骤\n参考：https://www.npmjs.com/package/react-native-vector-icons\n\n9. 警告：\n>  Animated: 'useNativeDriver' is not supported because the native animated module is missing. Failing back to JS-based animation. .....\n\n这个问题和iOS端相关，需要在cocoapods中，加入RCTAnimation的引用，类似于下：\n```\n# 'node_modules'目录一般位于根目录中\n  # 但是如果你的结构不同，那你就要根据实际路径修改下面的`:path`\n  pod 'React', :path => '../node_modules/react-native', :subspecs => [\n    'Core',\n    'RCTAnimation',\n    'RCTText',\n    'RCTImage',\n    'RCTLinkingIOS',\n    'RCTSettings',\n    'RCTVibration',\n    'RCTActionSheet',\n    'RCTNetwork',\n    'RCTWebSocket', # 这个模块是用于调试功能的\n    # 在这里继续添加你所需要的模块\n  ]\n  # 如果你的RN版本 >= 0.42.0，请加入下面这行\n  pod \"Yoga\", :path => \"../node_modules/react-native/ReactCommon/yoga\"\n\npod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'\n```\n\n10. Deviceinfo native modules is not installed correctly\n\n检查iOS工程，0.42的react native中有RCTConvert+Map这个文件，而0.44的版本中有这个文件，如果iOS工程中是用Cocoapods来管理第三方库的话，那么需要执行 pod update更新一下。\n\n11. [iOS][cocoapods] 'RCTAnimation/RCTValueAnimatedNode.h' file not found\n\n参考链接：https://github.com/facebook/react-native/issues/13198\n需要在报错的文件中，修改RCTValueAnimatedNode.h的引用方式，从尖括号改成双引号：\n#import \"RCTValueAnimatedNode.h\"\n\n12. TaskQueue: Error with task : No item for index 0\n\n解决方法：\n在使用数组的map方法时，要给每条数据加一个唯一key的键，并且要return一下，正确写法如下：\n```\nif(json.data.list &&\n   json.data.list.length > 0){\n\n    if(this._requestGradeList_para.pagesize === 1){\n        this.teacherGradeListStore.initialList(json.data.list.map( (item)=>{\n            item[\"key\"] = item.student_id;\n            return item;\n        }));\n    }else{\n        this.teacherGradeListStore.concatList(json.data.list.map( (item)=>{\n            item[\"key\"] = item.student_id;\n            return item;\n     }));\n```\n\n13. 集成图标第三方库“react-native-charts-wrapper”的步骤和方法\n\n解决方法：参考链接：http://blog.csdn.net/sinat_17775997/article/details/67635156\n\n14. Warning: In next release empty section headers will be rendered. In this release you can use 'enableEmptySections' flag to render empty section headers.\n\n解决方法：\n这个错误出现在ListView中，在以后的版本中才会实现空的section headers作为默认值，当前版本并没有支持。\n如果我们不需要使用headers的话，可以禁止EmptySections。\n解决方法：\n```\n \u003CListView\n      style={styles.listView}\n      dataSource={this.state.dataSource}\n      enableEmptySections={true}\n      />\n```\n","react native在安装或者开发过程中可能遇到的问题，以及对应的解决方法，供大家作为参考。","",499668042977349,{"phone":15,"userId":13,"nickName":16,"vipType":17,"avatar":18,"sign":19,"createdAt":20},"13121171998","全栈老韩",1,"https://image.xinwei.ltd/images/IMG_5430.JPG","全栈工程师，擅长iOS App开发、前端（vue、react、nuxt、小程序&Taro）开发、Flutter、React Native、后端（midwayjs、golang、express、koa）开发、docker容器、seo优化等。","2024-01-01T16:14:30.305Z",2,{"id":21,"name":23},"IT技术",12,{"id":24,"name":26,"parentId":21},"React Native",[],336,0,"react native,react native项目,react native issue"]