React 选择器:通过两个组件将 onChange 事件传递回去

Question

我正在尝试将 onChange 事件从 React 选择器通过两个组件传递到父应用程序。 使用下面的内容，e.target.value 是未定义的，因此事件似乎不会返回。什么是不正确的？

父应用程序，通过一直向下传递选择城市，我假设事件 e 应该回到它。

selectCity = e => {
console.log('filter city' + e.target.value)
this.setState({
filteredBuildings: this.state.filteredBuildings.filter((b) =>
b.filterOptions.city === e.target.value)
})
}
<FilterSection
cityFilterOptions={this.getCityFilterOptions()}
selectCity={this.selectCity}
/>

中间组件，过滤器部分，只需传递选择城市：

const FilterSection = props =>
<div className="filter-section">
<Filter
cityFilterOptions={props.cityFilterOptions}
selectCity={props.selectCity}
/>    
</div>

子组件，尝试将selectCity函数设置为 onChange 事件。

return (
<div className="filter-row">
<div className="filter">
<Select
onChange={this.props.selectCity}
className="basic-single"
classNamePrefix="select"
isClearable={true}
isSearchable={true}
name="color"
options={this.props.cityFilterOptions}
placeholder="All Cities"
/>
</div>
</div>
);

Answer 1

尝试将事件作为参数传递给 this.props.selectCity，如下所示：onChange={(e)=>this.props.selectCity(e)}检查您的 this.props.cityFilterOptions 可能不会返回正确的结果。