[英]react-select handle onChange with props
我在子组件中使用 react-select 但希望将 Select 值存储在父组件中的状态中。
我很感激我必须将 onChange 存储在 state 中,然后将其传递给 Select 值,但我想将这个临时 onChange 状态保留在子组件而不是父组件中。
所以问题是我如何从孩子的 onChange 状态设置父状态(进入道具)。
父组件
campaignName (campaign){
//will setState here
console.log(campaign)
}
...
<FormGroup>
<Campaign
campaignName={this.campaignName.bind(this)}
campaignOptions={code in here that sets option}
/>
</FormGroup>
子组件
updateValue (newValue) {
this.setState({
selectValue: newValue,
// how do I set the parent state from this
});
<Select
onChange={this.updateValue}
value={this.props.campaignName}
options={this.props.campaignOptions}
/>
将函数直接从父级传递给将处理 onChange 的子级:
父组件
handleSelect(e) {
this.setState({
selectValue: e.target.value,
});
}
render() {
<ChildComponent selectOnChange={this.handleSelect} />
}
子组件
<Select
onChange={this.props.selectOnChange}
value={this.props.campaignName}
/>
或(如果您希望该方法留在孩子身上)
updateValue(e) {
this.props.selectOnChange(e); //call the passed props here
}
<Select
onChange={this.updateValue}
value={this.props.campaignName}
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.