Blueprintjs选择键盘导航不工作- React

Question

我有一个blueprintjs select组件，我想知道如何在该组件上启用键盘导航。我遵循了他们的文档，但无法更好地理解它。这是itemRendered修改器属性的问题吗？敬请指教。

下面是我使用blueprintjs select实现的链接：

Stackblitz

任何帮助都是非常感谢的。

Answer 1

您只需要连接onActiveItemChange来更新您在Select as上为activeItem使用的值：

<CountrySelect
  items={countryCodes || []}
  onItemSelect={handleItemSelect}
  activeItem={selectedCountry}
  onActiveItemChange={setSelectedCountry}
  {...CountrySelectProps}
  noResults={<MenuItem disabled={true} text="No results." />}
>

Answer 2

不需要实现onActiveItemChange

根据此处的文档：https://blueprintjs.com/docs/#select/multi-select

示例：https://github.com/palantir/blueprint/blob/develop/packages/docs-app/src/examples/select-examples/multiSelectExample.tsx

确保您的项目渲染器设置了active={modifiers.active}

 private renderFilm: ItemRenderer<IFilm> = (film, { modifiers, handleClick }) => {
        if (!modifiers.matchesPredicate) {
            return null;
        }
        return (
            <MenuItem
                active={modifiers.active}