javascript - React Native ReferenceError 找不到变量

Question

已阅读 https://facebook.github.io/react-native/docs/text.html 中的文档.目前尚不清楚如何链接两个类之间的引用。我正在尝试使用标签而不是它，但它没有给出引用错误。

代码:

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

class MyAppHeaderText extends Component {

    render() {
        return(
            <MyAppHeader>
                <Text style={{fontSize:20}}>
                    {this.props.children}
                </Text>
            </MyAppHeader>
        )
    }
}

class Test2 extends Component {

    constructor(props){
        super(props);

        this.state = {
            mainText: 'This is Bird',
            subText : 'Not dino'
        }
    }

    render() {
        return(
            <View>
                {/* <Text>

                    {this.state.mainText}
                    {this.state.subText}
                </Text> */}
                <MyAppHeaderText>
                    <MyAppHeader>
                        {this.state.mainText}
                        {this.state.subText}
                    </MyAppHeader>
                </MyAppHeaderText>
            </View>
        )
    }
}

export default MyAppHeaderText;

AppRegistry.registerComponent('AwesomeProject',() => Test2);

错误:

ReferenceError: Can't find variable: MyAppHeader

This error is located at: in Test2 (at renderApplication.js:35) in RCTView (at View.js:113) in View (at AppContainer.js:102) in RCTView (at View.js:113) in View (at AppContainer.js:122) in AppContainer (at renderApplication.js:34)

Answer 1

正如 Derek 提到的，

you have never defined MyAppHeader, therefore you will get error.

您可以删除所有 <MyAppHeader></MyAppHeader>在您的项目中，它应该可以工作!

否则您将需要定义 MyAppHeader 组件以使其工作。

明确发布 React 组件 Components and Props - React

希望对您有所帮助。