路由应该声明一个屏幕。 [反应原生导航错误]

问题描述:

嗨,我是新的反应原生,我面临与路由奇怪的问题。我做错了什么,但需要有人来指导我。路由应该声明一个屏幕。 [反应原生导航错误]

index.android.js

import { LandingScreen } from './src/components/landing_screen.js' 
import HomeScreen from './src/app_component.js' 
import { StackNavigator } from 'react-navigation'; 

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

AppRegistry.registerComponent('HomeScreen',() => SimpleApp); 

app_component.js

// Other imports ... 
export default class HomeScreen extends Component { 
    static navigationOptions = { 
    title: 'Home Screen', 
    }; 
    render() { 
    const { navigate } = this.props.navigation; 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}> 
      Welcome to React Native! 
     </Text> 
     <Text style={styles.instructions}> Hello CHannoo!!!</Text> 
     <Text style={styles.instructions}> 
      To get started, edit index.android.js 
     </Text> 
     <Text style={styles.instructions}> 
      Double tap R on your keyboard to reload,{'\n'} 
      Shake or press menu button for dev menu 
     </Text> 
     <Button 
      title="Go to 2nd Page" 
      onPress={() => 
      // alert('hello'); 
      navigate('LandingScreen') 
      // navigate('Home', { name: 'Jane' }) 
      } 
     /> 
     </View> 
    ); 
    } 

    componentDidMount() { 
    SplashScreen.close({ 
     animationType: SplashScreen.animationType.scale, 
     duration: 850, 
     delay: 500, 
    }) 
    } 
} 

landing_screen.js

export default class LandingScreen extends Component { 
static navigationOptions = { 
    title: 'Landing Screen Title', 
}; 
render() { 
    return (........) 
} 

它如果我们删除路线登陆工作正常。但是当我们添加这条路线时,我们会得到错误

Route'Landing'应该声明一个屏幕。例如......

您的LandingScreen已导出为default,但您是按名称导入的。

你的import语句是这样的:

import { LandingScreen } from './src/components/landing_screen.js' 

低于线(没有大括号)替换它:

import LandingScreen from './src/components/landing_screen.js' 

应该解决的问题。

但你可能会得到一个新的错误作为@Medet指出,因为你必须要改变这一行:

navigate('LandingScreen') 

到:

navigate('Landing') 

因为你的网名登陆。

+0

感谢黄昏奏效。 问题在于import语句。导航工作正常,因为我在这里拼写错了:) –

你叫navigate('LandingScreen')
但网名是Landing
+ @黄昏的答案应该解决