最简单的示例中未显示StackNavigator标题 [英] StackNavigator title not showing in simplest example

问题描述

我刚刚开始React Native开发，安装了Expo，创建了一个应用程序(作品)，安装了react-navigation，并使用 https://reactnavigation.org/docs/intro/.我从命令行运行npm run ios，并使用Nuclide IDE.所有这些对我来说都是全新的.

I just started React Native development, installed Expo, created an app (works), installed react-navigation and tried the first StackNavigator example using the example from https://reactnavigation.org/docs/intro/. I am running npm run ios from the commandline, and using Nuclide IDE. All of which are completely new to me.

问题是，在运行示例时，iOS模拟器中的屏幕显示如下:

The problem is, that on running the example the screen in the iOS emulator shows this:

与其显示带有欢迎"的标题栏.

Instead of showing a title bar with 'Welcome' on it.

作为一个初学者，我不知道从这里去哪里.这是我的package.json:

As a beginner I have no clue where to go from here. Here's my package.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"
  }
}

有一个包含以下内容的app.json文件:

there's an app.json file with these contents:

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

我还添加了flow，它在示例代码中没有引发任何错误，但在react-navigation程序包中没有引发115错误.它们大多数看起来像:identifier 'expect', could not resolve name.

I also added flow, which throws me no errors in the example code, but 115 errors in the react-navigation package. Most of them look like: identifier 'expect', could not resolve name.

推荐答案

最后，我找到了答案这里:要使用 Expo XDE 中reactnavigation.org上的示例，必须进行一些更改.这是第一个示例所必需的更改:

In the end I found the answer here: To use the examples on reactnavigation.org in Expo XDE, you have to make some changes. Here are the changes necessary for the 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);

这篇关于最简单的示例中未显示StackNavigator标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！