Question

当我的App.js表示undefined不是一个对象（评估'this.props.navigation.navigate'）时，我有问题要理解我的错误。当它在主屏幕和chatsrceen之间切换时，我一直在关注本机文档。我仍然无法让它发挥作用。有人能帮助我吗？

import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  Button,
  View,
  Navigator,
} from 'react-native';
import { StackNavigator } from 'react-navigation';

class App extends React.Component {

  static navigationOptions = {
    title: 'Welcome',
  };
  render() {
    const { navigate } = this.props.navigation;
    return (
        <View>
          <Text>Hello, Chat App!</Text>
          <Button
              onPress={() => navigate('Chat')}
              title="Chat with Lucy"
          />
        </View>
    );
  }
}


class ChatScreen extends React.Component {
  static navigationOptions = {
    title: 'Chat with Lucy',
  };
  render() {
    return (
        <View>
          <Text>Chat with Lucy</Text>
        </View>
    );
  }
}

const App1 = StackNavigator({
  Home: { screen: App },
  Chat: { screen: ChatScreen },
});

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});

export default App1

Answer 1

您需要导出App1而不是App。

使用StackNavigator在屏幕之间导航

1 个答案: