堆栈导航-未定义函数问题

Question

StackNavigation使我在屏幕上看到以下崩溃。使用Android 6版本在HTC一号M8中执行了该应用。请找到以下代码，并请帮助我解决此问题：

  App.js

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
import  { Login } from './infoscreens/Login';
import  { ListInfo } from './infoscreens/ListInfo';
import { createStackNavigator, createAppContainer } from 'react-navigation';
const RootStack = createStackNavigator(
  {
    Login: {
      screen: Login,
    },
    ListInfo: {
      screen: ListInfo,
    },
  },
  {
    initialRouteName: 'Login',
  }
);
const AppContainer = createAppContainer(RootStack);
export default class App extends Component {
  render() {
    return (
      <AppContainer />
    );
  }
}

    Login.js

import React, { Component } from 'react';
import { View, Text, Button } from 'react-native';

export class Login extends React.Component {
  render() {
    return (
      <View>
        <Text>This is the Login screen</Text>
        <Button
        title="Go to Details"
        onPress={() => this.props.navigation.navigate('ListInfo')}
      />
      </View>
    )
  }
};

export default Login;

    ListInfo.js:

import React, { Component } from 'react';
import { View, Text, Button } from 'react-native';

export class ListInfo extends React.Component {
  render() {
    return (
      <View>
        <Text>This is the Login screen</Text>
      </View>
    )
  }
};

export default ListInfo;

                Package.JSON  

{
  "name": "ReactScreenNavigation",
  "version": "0.0.3",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.6.3",
    "react-native": "0.57.8",
    "react-navigation": "^3.0.8"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.48.5",
    "react-test-renderer": "16.6.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

Answer 1

您应该使用createStackNavigator，而不是stackNavigator。