reactjs - React-Downshift - 如何防止通过 Escape 键清除？

Question

我正在使用 React 开源组件Downshift来构建我的自定义下拉菜单。

我面临的问题是当用户按下键时，Downshift 会清除所选项目（并onChange使用 调用回调）。nullEscape

即使我的下拉菜单甚至没有空选项，这也会清除我的下拉菜单。

如何抑制此行为并使其仅关闭打开的下拉列表（如果已打开）而不更改值。

Answer 1

我想我只是自己想出来的：我添加了一个减少覆盖默认行为的状态：

  const stateReducer = (_, changes) => {
    switch (changes.type) {
      // Preventing from clearing value once ESC is pressed
      case Downshift.stateChangeTypes.keyDownEscape:
        return { isOpen: false };
      default:
        return changes;
    }
  };

  <Downshift stateReducer={stateReducer}>{/* your callback */}</Downshift>