歡迎大家 ?? 收藏咖杂，遇到問題在此頁面 command + F 說不定你遇到的問題已經(jīng)有解決方案了，如果有問題可以在下方評(píng)論，嘿嘿祷杈，(??ˇoˇ??)
react native cached bundles
出現(xiàn)原因：
(??ˇ_ˇ??)
多個(gè)react native應(yīng)用來回切換使用 Debug JS Remotely遠(yuǎn)程調(diào)試.
解決方案：
(??ˇoˇ??)
清一下Chrome瀏覽器的緩存就可以了。
No bundle URL present Make sure you’re running a packager server or have included a .jsbundle file in your application bundle
出現(xiàn)原因：
(??ˇ_ˇ??)
這個(gè)錯(cuò)誤一般在ios模擬器和真機(jī)上會(huì)遇到渗饮，網(wǎng)上看到原因有很多種但汞，這里不詳細(xì)說明。
解決方案：
(??ˇoˇ??)
- 首先互站，你的項(xiàng)目中是否使用了http的請(qǐng)求特占，如果使用了，請(qǐng)配置
image.png
配置完成后重新關(guān)閉React Packager云茸，React Packager是啥是目？答：執(zhí)行react-native run-ios后自動(dòng)啟動(dòng)命令窗口，然后再重新運(yùn)行react-native run-ios标捺。
image.png - 如果以上方法還是報(bào)錯(cuò)的話懊纳，刪除工程目錄下
ios文件夾下的build文件夾，關(guān)閉React Packager亡容，然后再次運(yùn)行react-native run-ios嗤疯。
以上兩個(gè)方法就是我的解決方案，希望能幫助到各位闺兢。
ExceptionsManager.js:73 Raw text cannot be used outside of a <Text> tag. Not rendering string: ''
出現(xiàn)原因：
(??ˇ_ˇ??)
設(shè)置了 跳轉(zhuǎn)的當(dāng)前界面navigationOptions title或者h(yuǎn)eaderTitle為空字符串了茂缚。
解決方案：
(??ˇoˇ??)
默認(rèn)不設(shè)置或者設(shè)置不為空的字符串。
Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.
出現(xiàn)原因：
(??ˇ_ˇ??)
我們?cè)谠摻M件還沒裝載完成之前調(diào)用了該組件setState方法屋谭，一般這種錯(cuò)誤會(huì)出現(xiàn)在很多異步的操作中脚囊，比如fetch操作，雖然這是一個(gè)警告其實(shí)是個(gè)致命錯(cuò)誤桐磁，警告之后再次操作就會(huì)報(bào)錯(cuò)悔耘。
解決方案：
(??ˇoˇ??)
在組件裝載完成的componentDidMount方法里做setState操作。
ios上http的圖片顯示不出來
出現(xiàn)原因：
(??ˇ_ˇ??)
在iOS9之后我擂，網(wǎng)絡(luò)請(qǐng)求默認(rèn)為Https請(qǐng)求衬以。
解決方案：
(??ˇoˇ??)
如需支持Http，修改info.plist文件添加鍵值對(duì)設(shè)置允許http訪問校摩。
或者
在App Transport Security Settings中添加
Allow Arbitrary Loads設(shè)置為YES即可看峻。
You have not accepted the license agreements of the following SDK components:
出現(xiàn)原因
(??ˇ_ˇ??)
最新在使用react-native-vector-icons組件的時(shí)候，按照官方文檔手動(dòng)配置完后 run-android 后出現(xiàn)了上面的錯(cuò)誤衙吩，是要因?yàn)槿鄙?Android SDK Platform 26互妓。
解決方案
(??ˇoˇ??)
使用android studio 導(dǎo)入react native項(xiàng)目中的android目錄，然后項(xiàng)目在gradle的時(shí)候控制臺(tái)自動(dòng)彈出錯(cuò)誤 Error:Failed to find Build Tools revision 26.0.1 install.build.tools">Install Build Tools 26.0.1 and sync project雙擊錯(cuò)誤，同意安裝android-26车猬。
安裝完成后重新build ok霉猛。
- 最近在使用官方提供的
FlatList做上拉加載更多的時(shí)候，發(fā)現(xiàn)每次上拉刷新的時(shí)候都會(huì)連續(xù)執(zhí)行兩次onEndReached的回調(diào)方法珠闰。
出現(xiàn)原因
(??ˇ_ˇ??)
官方FlatList組件的bug惜浅。
解決方案
(??ˇoˇ??)
1,在FlatList中添加onMomentumScrollBegin方法回調(diào)。
<FlatList
data={this.props.data}
onEndReached={...}
onEndReachedThreshold={0.5}
...
onMomentumScrollBegin={() => { this.onEndReachedCalledDuringMomentum = false; }}
/>
2伏嗜，在onEndReached的回調(diào)方法中加入判斷坛悉。
onEndReached = () => {
if (!this.onEndReachedCalledDuringMomentum) {
this.props.fetchData();
this.onEndReachedCalledDuringMomentum = true;
}
};
Cannot read property 'xxx' of undefined
出現(xiàn)原因
(??ˇ_ˇ??)
出現(xiàn)這種情況的時(shí)候是比較好定位的，首先定位到代碼位置承绸，然后檢查 sss.xxx sss時(shí)候是否為空null裸影。我是在下面這種下遇到的，我當(dāng)前環(huán)境用的是react native 0.49.5版本军熏，在github上找到了一個(gè)比較老版本的插件轩猩，然后安裝運(yùn)行，報(bào)了這個(gè)錯(cuò)誤荡澎。
定位步驟
1均践，在項(xiàng)目的node_modules下找到該插件的index.js。
2摩幔，老版中PropTypes是從react中導(dǎo)出的
解決方案
(??ˇoˇ??)
1彤委，在新版中PropTypes應(yīng)該是下圖這樣引用的，所以需要修改上圖的引入方式
2或衡，重新run就ok了
Requiring module "NativeModules" which threw an exception (index.android.bundle:64)
出現(xiàn)原因
(??ˇ_ˇ??)
react packager窗口沒有打開或者你關(guān)閉了焦影，本地資源服務(wù)沒有運(yùn)行起來。
解決方案
(??ˇoˇ??)
運(yùn)行 react-native run-android 自動(dòng)會(huì)打開這個(gè)命令窗口
- 運(yùn)行ios真機(jī)
Signing for "TestDemoTests" requires a development team. Select a development team in the project editor.Code signing is required for product type 'Unit Test Bundle' in SDK 'iOS 11.1'
image.png
出現(xiàn)原因
(??ˇ_ˇ??)
3的位置沒有設(shè)置Team
解決方案
(??ˇoˇ??)
設(shè)置完重新run就OK了
flatlist Invariant Violation: Tried to get frame for out of range index NaN
出現(xiàn)原因
(??ˇ_ˇ??)
flatlist 數(shù)據(jù)源data數(shù)據(jù)json結(jié)構(gòu)不是數(shù)組對(duì)象封断。
解決方案
(??ˇoˇ??)
數(shù)據(jù)源json結(jié)構(gòu)改為數(shù)組對(duì)象斯辰。
Warning: Failed child context type: Invalid child contextvirtualizedCell.cellKeyof typenumbersupplied toCellRenderer, expectedstring.
(??ˇ_ˇ??)
flatlist組件中keyExtractor配置項(xiàng)
<FlatList
...
keyExtractor = {this._keyExtractor}
...
/>
出現(xiàn)警告的react native版本是 0.53.0但我知道在0.49.5版本中沒有出現(xiàn)過，看警告的提示是要求我們傳一個(gè)string但我門傳入了一個(gè)number 類型澄港，不知道是不是一個(gè)bug椒涯，反正我是搞不懂react native為什么這么做柄沮，我是個(gè)強(qiáng)迫癥不喜歡??.
解決方案
(??ˇoˇ??)
修改之前code:
_keyExtractor = (item, index) => {
return item.id;
};
修改之后code:
_keyExtractor = (item, index) => {
return item.id.toString();
};
(??ˇ_ˇ??)
nw_socket_handle_socket_event [C409.1:1] Socket SO_ERROR [61: Connection refused]
解決方案
(??ˇoˇ??)
修改下列文件
patch-package
--- a/node_modules/react-native/React/Inspector/RCTInspectorPackagerConnection.m
+++ b/node_modules/react-native/React/Inspector/RCTInspectorPackagerConnection.m
@@ -196,7 +196,7 @@ RCT_NOT_IMPLEMENTED(- (instancetype)init)
[self abort:@"Websocket exception"
withCause:error];
}
- if (!_closed) {
+ if (!_closed && [error code] != ECONNREFUSED) {
[self reconnect];
}
}
patch-package
--- a/node_modules/react-devtools-core/build/backend.js
+++ b/node_modules/react-devtools-core/build/backend.js
@@ -23,11 +23,16 @@
return connectToDevTools(options);
}, 2e3);
}
- function handleClose() {
- hasClosed || (hasClosed = !0, scheduleRetry(), closeListeners.forEach(function(fn) {
- return fn();
- }));
- }
+ function handleClose() {
+ hasClosed || (hasClosed = !0, scheduleRetry(), closeListeners.forEach(function(fn) {
+ return fn();
+ }));
+ }
+ function handleError(err) {
+ hasClosed || (hasClosed = !0, closeListeners.forEach(function(fn) {
+ return fn();
+ }));
+ }
function handleMessage(evt) {
var data;
try {
@@ -48,7 +53,7 @@
} : _ref$isAppActive;
if (!isAppActive()) return void scheduleRetry();
var messageListeners = [], closeListeners = [], uri = "ws://" + host + ":" + port, ws = websocket ? websocket : new window.WebSocket(uri);
- ws.onclose = handleClose, ws.onerror = handleClose, ws.onmessage = handleMessage,
+ ws.onclose = handleClose, ws.onerror = handleError, ws.onmessage = handleMessage,
ws.onopen = function() {
var wall = {
listen: function(fn) {
