javascript - 如何获取 React Select 的 AsyncCreatable 实例的 ref 以将 Select 集中在其中？

Question

我已经看到它Select有一个ref在 React 世界中正常工作的道具。

但是我有一段代码通过以下方式间接使用它AsyncCreatable：

<AsyncCreatable>
  {({ default: AsyncCreatableSelect }) => (
    <AsyncCreatableSelect
      ref={this.focusRef}
      className="react-select-container"
      classNamePrefix="react-select"
      defaultOptions={this.props.choices || []}
      styles={customSelectStyles}
      theme={selectTheme}
      components={{ DropdownIndicator, Option }}
      isMulti
      value={selectedOption || []}
      loadOptions={this.loadOptions}
      onChange={this.handleChange}
      placeholder={this.props.intl.formatMessage(messages.select)}
      noOptionsMessage={() =>
        this.props.intl.formatMessage(messages.no_options)
      }
    />
  )}
</AsyncCreatable>

上述代码的问题是其中的以下行不起作用：

ref={this.focusRef}

我想在这里使用 ref 的原因是我想将Select.

我怎样才能做到这一点？我搜索了 react-select 的文档，表面上搜索了源代码。我想我看到 Select 有一个焦点方法，但我不知道如何使用它。

我快速阅读了这篇文章，但没有用，因为在这种情况下Select直接使用（而不是通过 HOC，例如AsyncCreatable）。

谢谢你。

更新

我还尝试将 ref 放在AyncCreatableJSX 标签上而不是放在 上AsyncCreatableSelect，但没有用。

标签： javascriptreactjsreact-select