如何使用react-select聚焦于输入字段？

Question

我正在使用react-select处理这个下拉菜单，并且里面有一个输入字段，可以进行搜索。无论如何，我有以下问题：

1）我应该专注于单击中的输入字段（由于某种原因它需要两次单击）

2） 当我打开下拉菜单并键入一个字符时，它会立即失去焦点（不应该失去焦点）。

3) 假设用户在输入字段内输入字母 “a”，然后将其删除（现在为空），现在如果用户再次将焦点放在输入字段内并点击 “退格键”，则会关闭下拉菜单（这是错误的），下拉菜单应保持打开状态。

谁能告诉我缺少什么？ 预先非常感谢！ 这是我的现场演示

注意： 我找到了一个非常相似的例子，但似乎看不出我缺少什么或需要应用/更改。这是我想要完成的示例：example

<Select
    classNamePrefix="select"
    closeMenuOnSelect={false}
    components={{
      DropdownIndicator,
      Group,
      GroupHeading,
      IndicatorSeparator,
      Input,
      MenuList: MenuListToRender,
      ValueContainer
    }}
    controlShouldRenderValue={false}
    hideSelectedOptions={false}
    isClearable={false}
    isMulti
    options={data}
    onKeyDown={(e) => console.log(e.key)}
    placeholder=""
    styles={customStyles}
    inputValue={inputValue}
    isSearchable={false}
    onMenuInputFocus={() => setIsFocused(true)}
    onChange={() => setIsFocused(false)}
    onInputChange={(val) => setInputValue(val)}
    {...{
      menuIsOpen: isFocused || undefined,
      isFocused: isFocused || undefined
    }}
  />

Answer 1

onInputChange={(val) => setInputValue(val)} 嘿兄弟我在这里发现错误

您可以在 OnChange={(val) => setInputValue(val)} 上添加这个吗

它会起作用的。