Javascript 反应选择器：通过两个组件传递onChange事件

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

父应用程序，通过一路向下传递selectCity，我假设事件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}
   />

selectCity=e=>{
console.log（'filter city'+e.target.value）
这是我的国家({
filteredBuildings:this.state.filteredBuildings.filter（（b）=>
b、 filterOptions.city==e.target.value）
})
}

中间组件，FilterSection，只需传递selectCity：

const FilterSection=props=>

子组件，尝试将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>
    );

返回(
);

尝试将事件作为参数传递给this.props.selectCity，如下所示：

onChange={（e）=>this.props.selectCity（e）}

还请检查可能未返回正确结果的this.props.cityFilterOptions。

请显示可重复的示例，制作一个像codesandbox.io这样的沙盒是非常常见的。在我看来，您正确地传递了onChange。问题可能出在标签本身吗？也许它的值实际上是未定义的？标记很好，因为列表正在填充，当我选择一个时，我可以看到组件更新中的值。这很有效。注意，出于某种原因，我还必须将e.target.value更改为e.value。

        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>
    );