react-bootstrap-typeahead替换ClearButton为CloseButton后点击失效且有图形bug

我在使用react-bootstrap-typeahead提供的ClearButton时遇到了图形显示bug，于是尝试用Bootstrap的CloseButton替换，但替换后的CloseButton无法触发点击事件。

图形bug截图：

代码实现 #

import { CloseButton } from "react-bootstrap";
import { Typeahead, ClearButton } from "react-bootstrap-typeahead";
import "bootstrap/dist/css/bootstrap.min.css";
import "react-bootstrap-typeahead/css/Typeahead.css";

<Typeahead
      id="search"
      options={chartData.datasets}
      labelKey={chartData.datasets.label}
      placeholder="look for projects"
      multiple
      onChange={setMultiSelections}
      selected={multiSelections}
    >
      {({ onClear, selected }) => (
        <div className="rbt-aux">
          {!!selected.length && <CloseButton onClick={onClear} />}
        </div>
      )}
</Typeahead>

已尝试的操作 #

• 修改rbt-close-content CSS类样式
• 替换样式文件为react-bootstrap-typeahead/css/Typeahead.bs5.css

请问我哪里操作有误？

内容的提问来源于stack exchange，提问作者lejanus12