2017-10-15 73 views
13

我试图用React Native项目上的不同屏幕进行练习。这里是我的代码从App.js文件。反应本机不变违规:查看配置

/** 
 
* Sample React Native App 
 
* https://github.com/facebook/react-native 
 
* @flow 
 
*/ 
 

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

 
import { StackNavigator } from 'react-navigation'; 
 

 
class HomeScreen extends React.Component { 
 
    static navigationOptions = { 
 
     title: "welcome", 
 
    }; 
 
    render() { 
 
     return <Text style={{ color: 'black '}}>Hello, Navigation!</Text>; 
 
    } 
 
} 
 

 
const navigation = StackNavigator({ 
 
    Home: { screen: HomeScreen }, 
 

 
}); 
 

 
export default class App extends Component<{}> { 
 
    render() { 
 
    return <navigation/>; 
 
    } 
 
} 
 

 
const styles = StyleSheet.create({ 
 
    container: { 
 
    flex: 1, 
 
    justifyContent: 'center', 
 
    alignItems: 'center', 
 
    backgroundColor: '#fff', 
 
    }, 
 
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

当我运行反应原生运行Android的,我得到一个不变冲突,它告诉我“来查看未找到的配置或名称导航”。然后发生这种违规行为的所有网站。 请帮助谢谢

+0

你在代码中包含的那些脚本是什么? – alexdriedger

+0

Stack Overlfow做到了,我不知道 –

回答

35

任何组件的名称必须大写。以您的名义,组件“导航”不会大写。它应该是“导航”。

+0

非常感谢.Didnt意识到命名不仅仅是一个约定,而是一个语法问题 –

+0

我从'react-native'导入'Image'时得到了同样的错误信息,并且还声明一个'Image'变量将'props.data'扩展到'render()'中。如果有人在这里不是出于上述相同的原因。也很高兴知道组件需要大写! – Progoogler