React-Downshift -如何防止被Esc键清除？

Question

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

我面临的问题是，当用户按下Escape键时，降档会清除选中的项目(并使用null调用onChange回调)。

这将清除我的dropdown，即使我的dropdown甚至没有空选项。

我怎样才能抑制这种行为，使它只关闭打开的下拉列表(如果它是打开的)，而不改变它的值。

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>