[英]How to pass all state values to number of child components and update the parent
I am new to react native and I have some challenge in my first app. 我是新来的本地人,我在第一个应用程序中遇到了一些挑战。 In my app I have parent component and more then one child component, in parent component I have state with values that I need to pass to all of my child components, in every child component if the state was update I need the parent gets update too, but I struggle how to pass all state values to child components.
在我的应用程序中,我有一个父组件,然后有一个以上的子组件,在父组件中,我具有需要传递给所有子组件的值的状态,在每个子组件中,如果状态为update,我也需要父级也要更新,但是我很难将所有状态值传递给子组件。
In my parent component (NavigatorRiddles) I am using navigator, my child components are HomeScreen and Riddles: 在我的父组件(NavigatorRiddles)中,我使用的是导航器,我的子组件是HomeScreen和Riddles:
export default class NavigatorRiddles extends React.Component {
constructor(props) {
super(props);
this.state = { userAnswer: '', count: 0, diamonds: 0, urldatabase: {}, wordsnumber: 0, riddleletter: '' };
}
render() {
return (
<View>
<HomeScreen getState={...this.state}/>
</View>
)
}
}
class RiddlesScreen extends React.Component {
static navigationOptions = {
header: null
}
render() {
return (
<View>
<Riddles navigation={this.props.navigation} getState={...this.state}/>
</View>
)
}
}
const Navigate = StackNavigator(
{
Home: { screen: HomeScreen },
Riddles: { screen: RiddlesScreen },
},
)
In the child components I don't new how to make the component actually to get that state 在子组件中,我不了解如何使组件实际获得该状态
every help really appreciated! 每一个帮助真的很感激! thanks.
谢谢。
I'm not sure if I understand you correctly, but you could pass down your state like so: 我不确定我是否正确理解您的意思,但是您可以这样传递您的状态:
<HomeScreen navigatorState={this.state} />
and then access this prop in the child: 然后在孩子中访问此道具:
class RiddlesScreen extends React.Component {
static navigationOptions = {
header: null
}
render() {
console.log(this.props.navigatorState) // { userAnswer: '', count: 0, diamonds: 0, urldatabase: {}, wordsnumber: 0, riddleletter: '' }
return (
<View>
<Riddles navigation={this.props.navigation} getState={...this.state}/>
</View>
)
}
}
Let me know if you have any questions. 如果您有任何疑问,请告诉我。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.