react-native-navigation(Wix) 适用于 android 但不适用于 ios:应用程序卡在闪屏中由本机反应提供支持,仅达到 index.js
react-native-navigation(Wix) works on android but not on ios: App gets stucked in splash screen Powered by react native, only reaches index.js
我遇到了标题中描述的问题。我 运行 调试器,它只到达 index.js 而不是 index.ios.js 例如,因为它甚至不存在于调试器中。所以这应该是一个 react-native-navigation 问题。它卡在启动画面中,应用程序名称显示由 React Native 提供支持。日志没有显示任何错误,只是随机警告。
我的AppDelegate.m是:
#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>
#import <FBSDKCoreKit/FBSDKCoreKit.h>
// **********************************************
// *** DON'T MISS: THE NEXT LINE IS IMPORTANT ***
// **********************************************
#import <TwitterKit/TwitterKit.h>
// IMPORTANT: if you're getting an Xcode error that RCCManager.h isn't found, you've probably ran "npm install"
// with npm ver 2. You'll need to "npm install" with npm 3 (see https://github.com/wix/react-native-navigation/issues/1)
#import <Firebase.h>
#import "RCCManager.h"
#import <React/RCTRootView.h>
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[FIRApp configure];
[[FBSDKApplicationDelegate sharedInstance] application:application
didFinishLaunchingWithOptions:launchOptions];
NSURL *jsCodeLocation;
#ifdef DEBUG
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
self.window.backgroundColor = [UIColor whiteColor];
[[RCCManager sharedInstance] initBridgeWithBundleURL:jsCodeLocation launchOptions:launchOptions];
return YES;
}
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
options:(NSDictionary<NSString *,id> *)options {
BOOL handled = [[FBSDKApplicationDelegate sharedInstance] application:application
openURL:url
sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey]
annotation:options[UIApplicationOpenURLOptionsAnnotationKey]
];
BOOL handledT = [[Twitter sharedInstance] application:application openURL:url options:options];
// Add any custom logic here.
return handled || handledT;
}
- (void)applicationDidBecomeActive:(UIApplication *)application {
[FBSDKAppEvents activateApp];
}
@end
我的index.js(调试器到达这个文件)
import React from 'react';
import { AppRegistry } from 'react-native';
import { Provider } from 'react-redux';
import App from './App';
import configureStore from './src/store/configureStore';
const store = configureStore();
const RNRedux = () => (
<Provider store={store}>
<App />
</Provider>
);
AppRegistry.registerComponent('myapp', () => RNRedux);
index.ios.js(android 一个与这个相同并且有效,调试器无法到达此文件)
import App from './App';
App();
应用程序文件:
import { Navigation } from "react-native-navigation";
import { Provider } from "react-redux";
import configureStore from "./src/store/configureStore";
import startMainTabs from "./src/screens/MainTabs/startMainTabs";
import AuthScreen from "./src/screens/Auth/Auth";
import MainScreen from "./src/screens/Main/Main";
const store = configureStore();
// Register Screens
Navigation.registerComponent(
"AuthScreen",
() => AuthScreen,
store,
Provider
);
Navigation.registerComponent(
"MainScreen",
() => MainScreen,
store,
Provider
);
// Start a App
export default () => startMainTabs();
还有我的 startMainTabs 文件:
import { Navigation } from 'react-native-navigation';
import { Platform } from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';
import LanguagesManager from '../../../config/LanguagesManager';
const startTabs = () => {
const language = new LanguagesManager("es");
Promise.all([
Icon.getImageSource(Platform.OS === 'android' ? "md-map" : "ios-map", 30),
Icon.getImageSource(Platform.OS === 'android' ? "md-share-alt" : "ios-share", 30),
Icon.getImageSource(Platform.OS === 'android' ? "md-menu" : "ios-menu", 30)
]).then(sources => {
Navigation.startTabBasedApp({
tabs: [
{
screen: "MainScreen",
label: language.causes_explorer_title,
title: language.causes_explorer_label,
icon: sources[0],
navigatorButtons: {
leftButtons: [
{
icon: sources[2],
title: language.sidedrawer_title,
id: "sideDrawerToggle"
}
]
}
}
],
tabsStyle: {
tabBarSelectedButtonColor: "orange"
},
drawer: {
left: {
screen: "SideDrawer"
}
},
appStyle: {
orientation: 'portrait',
tabBarSelectedButtonColor: "orange"
},
animationType: 'slide-down'
});
});
};
export default startTabs;
我在 package.json 文件中的依赖项:
"dependencies": {
"axios": "^0.18.0",
"lodash": "^4.17.5",
"native-base": "^2.4.1",
"react": "16.3.1",
"react-native": "0.54.1",
"react-native-app-intro-slider": "^0.2.4",
"react-native-datepicker": "^1.7.1",
"react-native-fbsdk": "^0.7.0",
"react-native-firebase": "^4.0.0",
"react-native-image-picker": "^0.26.7",
"react-native-navigation": "^1.1.435",
"react-native-twitter-signin": "^1.0.2",
"react-native-vector-icons": "^4.4.2",
"react-redux": "^5.0.6",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0"
}
有谁知道如何解决这个问题?非常感谢您的帮助!
问题出在 App.js 文件的导出上。我更改了 export default () => startMainTabs();开始MainTabs();它之所以有效,是因为它没有执行 index.ios.js 文件,因此该文件没有对这个新更改做任何事情。至于 android,我也只是将文件留空,因为使用此设置它将始终通过 index.js
我遇到了标题中描述的问题。我 运行 调试器,它只到达 index.js 而不是 index.ios.js 例如,因为它甚至不存在于调试器中。所以这应该是一个 react-native-navigation 问题。它卡在启动画面中,应用程序名称显示由 React Native 提供支持。日志没有显示任何错误,只是随机警告。
我的AppDelegate.m是:
#import "AppDelegate.h"
#import <React/RCTBundleURLProvider.h>
#import <FBSDKCoreKit/FBSDKCoreKit.h>
// **********************************************
// *** DON'T MISS: THE NEXT LINE IS IMPORTANT ***
// **********************************************
#import <TwitterKit/TwitterKit.h>
// IMPORTANT: if you're getting an Xcode error that RCCManager.h isn't found, you've probably ran "npm install"
// with npm ver 2. You'll need to "npm install" with npm 3 (see https://github.com/wix/react-native-navigation/issues/1)
#import <Firebase.h>
#import "RCCManager.h"
#import <React/RCTRootView.h>
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
[FIRApp configure];
[[FBSDKApplicationDelegate sharedInstance] application:application
didFinishLaunchingWithOptions:launchOptions];
NSURL *jsCodeLocation;
#ifdef DEBUG
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
self.window.backgroundColor = [UIColor whiteColor];
[[RCCManager sharedInstance] initBridgeWithBundleURL:jsCodeLocation launchOptions:launchOptions];
return YES;
}
- (BOOL)application:(UIApplication *)application
openURL:(NSURL *)url
options:(NSDictionary<NSString *,id> *)options {
BOOL handled = [[FBSDKApplicationDelegate sharedInstance] application:application
openURL:url
sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey]
annotation:options[UIApplicationOpenURLOptionsAnnotationKey]
];
BOOL handledT = [[Twitter sharedInstance] application:application openURL:url options:options];
// Add any custom logic here.
return handled || handledT;
}
- (void)applicationDidBecomeActive:(UIApplication *)application {
[FBSDKAppEvents activateApp];
}
@end
我的index.js(调试器到达这个文件)
import React from 'react';
import { AppRegistry } from 'react-native';
import { Provider } from 'react-redux';
import App from './App';
import configureStore from './src/store/configureStore';
const store = configureStore();
const RNRedux = () => (
<Provider store={store}>
<App />
</Provider>
);
AppRegistry.registerComponent('myapp', () => RNRedux);
index.ios.js(android 一个与这个相同并且有效,调试器无法到达此文件)
import App from './App';
App();
应用程序文件:
import { Navigation } from "react-native-navigation";
import { Provider } from "react-redux";
import configureStore from "./src/store/configureStore";
import startMainTabs from "./src/screens/MainTabs/startMainTabs";
import AuthScreen from "./src/screens/Auth/Auth";
import MainScreen from "./src/screens/Main/Main";
const store = configureStore();
// Register Screens
Navigation.registerComponent(
"AuthScreen",
() => AuthScreen,
store,
Provider
);
Navigation.registerComponent(
"MainScreen",
() => MainScreen,
store,
Provider
);
// Start a App
export default () => startMainTabs();
还有我的 startMainTabs 文件:
import { Navigation } from 'react-native-navigation';
import { Platform } from 'react-native';
import Icon from 'react-native-vector-icons/Ionicons';
import LanguagesManager from '../../../config/LanguagesManager';
const startTabs = () => {
const language = new LanguagesManager("es");
Promise.all([
Icon.getImageSource(Platform.OS === 'android' ? "md-map" : "ios-map", 30),
Icon.getImageSource(Platform.OS === 'android' ? "md-share-alt" : "ios-share", 30),
Icon.getImageSource(Platform.OS === 'android' ? "md-menu" : "ios-menu", 30)
]).then(sources => {
Navigation.startTabBasedApp({
tabs: [
{
screen: "MainScreen",
label: language.causes_explorer_title,
title: language.causes_explorer_label,
icon: sources[0],
navigatorButtons: {
leftButtons: [
{
icon: sources[2],
title: language.sidedrawer_title,
id: "sideDrawerToggle"
}
]
}
}
],
tabsStyle: {
tabBarSelectedButtonColor: "orange"
},
drawer: {
left: {
screen: "SideDrawer"
}
},
appStyle: {
orientation: 'portrait',
tabBarSelectedButtonColor: "orange"
},
animationType: 'slide-down'
});
});
};
export default startTabs;
我在 package.json 文件中的依赖项:
"dependencies": {
"axios": "^0.18.0",
"lodash": "^4.17.5",
"native-base": "^2.4.1",
"react": "16.3.1",
"react-native": "0.54.1",
"react-native-app-intro-slider": "^0.2.4",
"react-native-datepicker": "^1.7.1",
"react-native-fbsdk": "^0.7.0",
"react-native-firebase": "^4.0.0",
"react-native-image-picker": "^0.26.7",
"react-native-navigation": "^1.1.435",
"react-native-twitter-signin": "^1.0.2",
"react-native-vector-icons": "^4.4.2",
"react-redux": "^5.0.6",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0"
}
有谁知道如何解决这个问题?非常感谢您的帮助!
问题出在 App.js 文件的导出上。我更改了 export default () => startMainTabs();开始MainTabs();它之所以有效,是因为它没有执行 index.ios.js 文件,因此该文件没有对这个新更改做任何事情。至于 android,我也只是将文件留空,因为使用此设置它将始终通过 index.js