在 React-Select 中禁用对第一个选项的关注

Question

我在 React Select 中有一个下拉菜单，我面临焦点问题。每当我们打开下拉菜单时，选项列表中的第一项就会获得焦点。有几个属性被传递，但没有一个用于禁用此功能。我在他们的 github 中看到了与自动对焦相关的问题。但该道具仍然没有添加到他们的包中。我尝试使用焦点道具，但没有得到预期的结果。这是我的选择下拉列表的代码。

<Select 
     className="profile-module-select-container"
     classNamePrefix="profile-module-select"
     defaultValue={{value: 0, label: 0}}
     options={options}
     openMenuOnFocus={false}
     autoFocus={options.isFocused}
     styles={styles}
     onChange={selected => {
        this.setState({
        optionSelect: selected.value
        }, () => {onChange(this.state.optionSelect, formKey)});
      }}
        onMenuOpen={(e, i, o) => {
        this.setState({
        selectMenuOpen: true
        });
       }}
       onMenuClose={() => {
       this.setState({
       selectMenuOpen: false
       });
       }}
       components={
          {
           IndicatorSeparator:() => null,
           DropdownIndicator: DropdownCaret,
           Placeholder: CustomPlaceholder,
           Option: CustomOptionComponent
           }
          }
           placeholder={placeholder}
           isSearchable={false}
           isClearable={false}
           name={name}
           value={options.filter(option => {return option.value === value})}
      />

Answer 1

在 github 上查看他们的问题跟踪器后，我终于找到了上述问题的答案。该道具尚未合并到其主分支中。在此之前，如果有人将来试图找到解决方案，这里是解决办法。因此，在输入更改时，您必须在传递的函数上返回 null 以聚焦列表中的下一项。

<Select
 ref={ref => {
 this.selectRef = ref;
}}
 onInputChange={(value) => {this.selectRef.select.getNextFocusedOption = () => null }}
/>