React Native 将数据传递给同一文件上的另一个组件答案

【问题标题】：React Native Pass data to another component on same fileReact Native 将数据传递给同一文件上的另一个组件
【发布时间】：2020-03-26 06:45:18
【问题描述】：

我有两个组件，我想将数据从一个组件传递到另一个组件。

我已经实施了不同的解决方案，但无法解决这个问题以下是我的代码：

class PersonalInfo extends React.Component {
    constructor(props) {
        super(props)

    }
    state = {
        FirstName: '',
        LastName: '',
        Email: '',
        DateofBirth: '',
        Gender: '',
        AgeGroup: '',
        error: {}


    }
    NextSignUp = async (data) => {
        this.props.navigation.navigate("Addressinfo", { FirstName: 'waqas' })
    }
    render() {

        return (
            <View>
                <TouchableHighlight style={[styles.buttonContainer, styles.loginButton]} onPress={() => this.NextSignUp(this.state)} >
                    <Text style={styles.loginText}>Next</Text>
                </TouchableHighlight>
            </View>

        );
    }
}


class AddressInfo extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            isChecked: true,
            TermsConditioncheckbox: false,
            StreetAddress: '',
            City: '',
            State: '',
            ZipCode: '',
            error: {},
        }


    }
    render() {
        const { FirstName } = this.props.route.params.FirstName
        return ();
    }
}

我该如何解决这个问题？

【问题讨论】：

要从对象中提取项目，您必须将对象传递到等号的右侧。喜欢const { FirstName } = this.props.route.params

标签： react-native components

【解决方案1】：

const { FirstName } = this.props.navigation.route.params;

【讨论】：

【解决方案2】：

您可以使用如下导航的getParam()

const firstName = this.props.navigation.getParam('FirstName', 'Default value')

【讨论】：

尝试在componentDidMount()中获取