用于选择标记的数据实时搜索功能在react-bootstrap中不起作用

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Select } from 'react-bootstrap';

class MyComponent extends Component {
  render() {
    const { data, searchKeyword, updateSelectedData } = this.props;

    // 过滤数据
    const filteredData = data.filter(item =>
      item.label.toLowerCase().includes(searchKeyword.toLowerCase())
    );

    return (
      <div>
        <input
          type="text"
          value={searchKeyword}
          onChange={e => updateSelectedData(e.target.value)}
        />
        <Select
          value={this.props.selectedData}
          onChange={e => updateSelectedData(e.target.value)}
        >
          {filteredData.map(item => (
            <option key={item.value} value={item.value}>
              {item.label}
            </option>
          ))}
        </Select>
      </div>
    );
  }
}

// 将Redux store中的数据映射到组件的props中
const mapStateToProps = state => ({
  data: state.data,
  searchKeyword: state.searchKeyword,
  selectedData: state.selectedData
});

// 将更新数据的action映射到组件的props中
const mapDispatchToProps = dispatch => ({
  updateSelectedData: keyword => dispatch({ type: 'UPDATE_SELECTED_DATA', keyword })
});

// 使用connect函数将组件与Redux store连接起来
export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);