React Native Invariant Violation：查看配置

Posted 2023-02-22

【中文标题】React Native Invariant Violation：查看配置

【英文标题】：React Native Invariant Violation: View config

【发布时间】：2018-03-26 19:17:21

【问题描述】：

我正在尝试在 React Native 项目中使用不同的屏幕进行练习。这是我在 App.js 文件中的代码。

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',
  ,
);

当我运行 react-native run-android 时，我得到一个 Invariant Violation，它告诉我“查看未找到的配置或名称导航”。然后是发生这种违规行为的所有站点。 请帮忙，谢谢。

【问题讨论】：

您在代码中包含的那些脚本是什么？

Stack Overlfow 做到了，我不知道

【参考方案1】：

在 react native 中，组件的名称应该以大写字母开头，所以它是：

const Navigation = StackNavigator(
    Home:  screen: HomeScreen ,

);

并用大写来称呼它：

export default class App extends Component<> 
  render() 
    return <Navigation/>;
  

【参考方案2】：

任何组件的名称都必须大写。以您的名义，组件“导航”没有大写。应该是“导航”。

【讨论】：

非常感谢。没有意识到这里的命名不仅仅是一个约定，而是一个语法问题

我从react-native 导入Image 并在我的render() 中传播我的props.data 声明Image 变量时收到了相同的错误消息。万一有人在这里不是出于上述相同的原因。也很高兴知道组件需要大写！