TypeError:无法设置未定义或空引用的属性'props-反应本机组件

问题描述 投票:0回答:2

我是本机反应的新手。当我检查代码时,我可以从中学习有关组件的信息,但是即使在文档中仍然出现道具错误,即使在文档中,我也正在使用props组件进行本机反应,但是为什么仍然出现错误检查文档链接(https://facebook.github.io/react-native/docs/props

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

    class UserInformation extends Component(){
      render(){
        return(
          <View>
            <Text>{this.props.Name}</Text>
            <Text>{this.props.Status}</Text>
          </View>
        );
      }

}

function App() {

  return (
    <View style={styles.container}>

       <UserInformation Name='Hamza' Status='Single' />
       <UserInformation Name='Shahwar' Status='Comitted' />
    </View>
  );
}

export default App;

错误:TypeError:无法设置未定义或空引用的属性'props'

javascript reactjs react-native
2个回答
3
投票

您无法extend功能组件。相反,在我看来这是一个错字错误:

class UserInformation extends Component{
                            //--------^^-------remove ()

0
投票

[如果您正在使用类组件,则需要更改

class UserInformation extends Component(){

to

class UserInformation extends React.Component{

并添加

constructor(props) {
 super(props) // <---- this is the part which give you this.props
}

但是...我建议您使用App()之类的功能组件>

const UserInformation = (props) => {
        return(
          <View>
            <Text>{props.Name}</Text>
            <Text>{props.Status}</Text>
          </View>
        );
}
© www.soinside.com 2019 - 2024. All rights reserved.