react-bootstrap-typeahead - 如何在 React-Bootstrap-Typeahead 提示上使用 shouldSelect 来检测 "enter"和 ","击键

Question

我一直在尝试找出一种方法来选择“Enter”或“,”击键时的提示，但找不到任何相关文档。此外，我在编译期间收到以下警告“警告:[react-bootstrap-typeahead] selectHintOnEnter Prop 已弃用。在 提示上使用 shouldSelect Prop 组件来定义哪些击键可以选择提示。”是否有关于如何在“提示”上使用 shouldSelect 的示例？

Answer 1

shouldSelect 属性具有以下签名:

(shouldSelect: boolean, SyntheticKeyboardEvent<HTMLInputElement>) => boolean

您可以使用它来定义应选择提示的条件。在您的情况下，您需要类似以下内容:

<Hint
  shouldSelect={(shouldSelect, e) => {
    // Select the hint if the user hits 'enter' or ','
    return e.keyCode === 13 || e.keyCode === 188 || shouldSelect;
  }}>
  ...
</Hint>

这是一个工作示例:https://codesandbox.io/s/rbt-shouldselect-example-51s7n