【发布时间】:2019-10-05 18:45:41
【问题描述】:
我无法从子组件调用父组件的 setState
我尝试通过在父组件中绑定一个函数并在该函数中调用 setState 来解决此问题。我在子组件的 props 中传递了函数,但它仍然找不到父组件的 setState 函数。
const CrewsAdapter = props => {
if(props.data.loading) {
return <View><Text>Loading crews</Text></View>
}
if(props.data.getAllCrews) {
crewsNames= props.data.getAllCrews.map(crew => ({"value": crew.crewName}));
return (
<View style={{ flexDirection: 'column', alignItems: 'center', backgroundColor: '#ffffff' }}>
<View style={[styles.container, { flex: 0.25 }]}>
<Text style={styles.headerText}>Crews</Text>
</View>
<View style={{ flexDirection: 'row' }}>
<View style={{ flex: 0.9 }}>
<Dropdown label="Crews List"
data={crewsNames}
onChangeText = {(value) => {this.props.stateHandler(value)}}
/>
</View>
</View>
<View style={{ flexDirection: 'row' }}>
<Crew/>
</View>
</View>
);
}
return <View><Text>No data</Text></View>
};
export default class CrewsScreen extends Component {
constructor(props) {
super(props);
this.stateHandler = this.stateHandler.bind(this);
this.state = {
crewName: '',
}
}
stateHandler(value){
this.setState({crewName: value});
}
render() {
const AllCrews = graphql(crewsList, {options: (props => ({}))})(CrewsAdapter);
return (
<SafeAreaView style={styles.screen}>
<ToolBar />
<AllCrews stateHandler = {this.stateHandler}/>
<CrewsListFooter navProps={{...this.props}}/>
</SafeAreaView>
);
}
}
我正在尝试在下拉列表更改时设置状态。
<Dropdown label="Crews List"
data={crewsNames}
onChangeText = {(value) => {this.props.stateHandler(value)}}
/>
但我收到错误消息:“未定义不是对象(正在评估 _this.props.stateHandler”
非常感谢您对此的任何帮助。
【问题讨论】:
标签: reactjs react-native graphql