制表符在预输入组件中未选择自动完成选项

Question

我正在使用react-bootstrap-typeahead组件，但在找出导致该组件丢失tab函数以选择自动完成功能的原因时遇到了麻烦。如果使用onInputChange，则使用Tab键选择停止工作。这似乎受onInputChange更新name字段的影响。

这是组件应该工作的方式，还是我实施不正确的方式。用户体验不是很好。

<Typeahead
  onChange={(suppliersSelected) => {
    if (suppliersSelected.length === 1) {
      handleInputChange({
        supplier: {
          ...suppliersSelected[0]
        }
      });
    }
  }}
  labelKey="name"
  options={suppliers}
  selected={[
    {
      name
    }
  ]}
  id="name"
  placeholder="Supplier name"
  onInputChange={(text) => {
    handleInputChange({
      supplier: {
        name: text
      }
    });
  }}
/>

Answer 1

回答我自己的问题。通过消除该问题，该问题似乎与selected有关，所描述的问题消失了。