在 React Native 中将状态从子组件传递到父组件

2023-12-29

我的应用程序有一个设置屏幕(子组件),您可以在其中更改有关您自己的信息,我正在尝试将其呈现在我的应用程序的个人资料屏幕(父组件)上。因此,个人资料屏幕会显示您的信息,如果您想更改任何信息,您可以在设置中进行操作。现在,我在设置屏幕中所做的任何更改都会显示在 Firebase 中,但如果我返回个人资料屏幕,设置中的更改不会呈现。当然,如果我关闭应用程序并重新加载它,更改将会存在,因为设置中的更改正在注册到 firebase;但是,状态不会从子组件传递到父组件。有人对如何将状态从设置(子)组件传递到配置文件(父)组件有任何建议吗?


你可以尝试 redux,每当你在 redux 存储中更改数据时,它都会通过 props 将数据存储在状态中。

另一个想法是,将 setState 方法传递给子组件。

Parent

class Parent extends Component {
    updateState (data) {
        this.setState(data);
    }
    render() {
        <View>
            <Child updateParentState={this.updateState.bind(this)} />
        </View>
    }
}

Child

class Child extends Component {
    updateParentState(data) {
        this.props.updateParentState(data);
    }

    render() {
        <View>
            <Button title="Change" onPress={() => {this.updateParentState({name: 'test'})}} />
        </View>
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 React Native 中将状态从子组件传递到父组件 的相关文章

随机推荐