反應 - 導航：路線應宣佈一個屏幕...錯誤

我是新的反應，導航和我遵循site上的步驟，但我得到一個錯誤，說'路線'聊天'應該宣佈一個屏幕...下面是我的代碼供參考。反應 - 導航：路線應宣佈一個屏幕...錯誤

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

class HomeScreen 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> 
    ); 
    } 
} 

AppRegistry.registerComponent('navigationApp',() => navigationApp);

這是我認爲的錯誤發生

const navigationApp = StackNavigator({ 
    Home: { screen: HomeScreen }, 
    Chat: { screen: ChatScreen }, 
}); 

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

來源

2017-06-02 NSCoder

您可以測試在navigationApp上方聲明ChatScreen .. –

@NeelGala謝謝，實際上工作。 – NSCoder

我面臨着同樣的問題，因爲你太here.Well，根據我的解決方案，我所做的是我把符合：

const navigationApp = StackNavigator({ 
    Home: { screen: HomeScreen }, 
    Chat: { screen: ChatScreen }, 
});

頂部，就在AppRegistry ...行之上。它應該在index.android.js文件中。

而且不要忘了包括這條線在該文件的頂部太：

import { ChatScreen } from './App';

並根據自己所關注的教程（我相信這是一樣的就是我下面在這裏），你應該有一個名爲'app.js'的文件;您在導入行中引用的內容。 'app.js' 的

內容：

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

就是這樣。但是，這取決於您使用的機器和系統。我正在使用Mac OS Sierra的MacBook Pro 10.12.6

並且react-native也是最新版本，不確定是否有更新版本（不時有更新版本）。

嘗試修改一行/命令，以適合您的版本爲準，並仔細閱讀示例/教程。由於某些更新/不同的系統環境，可能會有一些不推薦的功能/不可用代碼等。

祝你好運！

來源

2017-07-26 09:53:15 Fariz

如果您的組件或目錄有index.js，請不要忘記在其中添加導出！（不，我沒有做到這一點....）

關於組織一個項目一個很好的文章是和使用index.js的：Organizing a React Native Project對中

來源

2017-12-04 19:49:05

將navigationOptions到像

{screen: ScreenComponent, navigationOptions: ...your options }

來源

2017-12-30 03:04:18

反應 - 導航：路線應宣佈一個屏幕...錯誤

回答

相關問題