2017-05-27 16 views
1

Expoがインストールされ、アプリケーションが作成され、react-navigationがインストールされ、https://reactnavigation.org/docs/intro/の例を使用して最初のStackNavigatorの例が試されました。私はnpm run iosをコマンドラインから実行し、Nuclide IDEを使用しています。すべてが私にとって全く新しいものです。StackNavigatorのタイトルが最も単純な例ではありません

missing title bar

の代わりに、その上に「ようこそ」でタイトルバーを示す:

問題があり、iOSのエミュレータの画面例を実行している上、それはこのことを示しています。

初心者から私はここからどこに行くのか分からない。これらの内容でapp.jsonファイルがあります

{ 
    "name": "rnproject", 
    "version": "0.1.0", 
    "private": true, 
    "devDependencies": { 
    "babel-cli": "^6.24.1", 
    "babel-preset-flow": "^6.23.0", 
    "flow-bin": "0.42.0", 
    "jest-expo": "~1.0.1", 
    "react-native-scripts": "0.0.30", 
    "react-test-renderer": "16.0.0-alpha.6" 
    }, 
    "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js", 
    "scripts": { 
    "start": "react-native-scripts start", 
    "eject": "react-native-scripts eject", 
    "android": "react-native-scripts android", 
    "ios": "react-native-scripts ios", 
    "test": "node node_modules/jest/bin/jest.js --watch" 
    }, 
    "jest": { 
    "preset": "jest-expo" 
    }, 
    "dependencies": { 
    "expo": "^17.0.0", 
    "react": "16.0.0-alpha.6", 
    "react-native": "^0.44.0", 
    "react-navigation": "^1.0.0-beta.11" 
    } 
} 

::私もflowを追加

{ 
    "expo": { 
    "sdkVersion": "17.0.0" 
    } 
} 

、サンプルコードでは私にエラーをスローしませんが、中に115個のエラーがここに私のpackage.jsonですreact-navigationパッケージ。それらのほとんどは次のようになります:identifier 'expect', could not resolve name

答えて

1

最後に、私は答えhereが見つかりました:万博XDEreactnavigation.org上の例を使用するには、あなたはいくつかの変更を行う必要があります。 first exampleに必要な変更点は次のとおりです。

import Expo from 'expo'; // <--- include this line 
import React from 'react'; 
import { 
    AppRegistry, // <- remove this line 
    Text, 
} from 'react-native'; 
import { StackNavigator } from 'react-navigation'; 

class HomeScreen extends React.Component { 
    static navigationOptions = { 
    title: 'Welcome', 
    }; 
    render() { 
    return <Text>Hello, Navigation!</Text>; 
    } 
} 

const SimpleApp = StackNavigator({ 
    Home: { screen: HomeScreen }, 
}); 

// change the following line: 
AppRegistry.registerComponent('SimpleApp',() => SimpleApp); 
// into: 
Expo.registerRootComponent(SimpleApp); 
関連する問題