Javascript 在“反应选择”中禁用聚焦于第一个选项

Javascript 在“反应选择”中禁用聚焦于第一个选项,javascript,reactjs,react-select,Javascript,Reactjs,React Select,我在React Select中有一个下拉列表,我正面临一个焦点问题。每当我们打开下拉列表时,选项列表中的第一项就是聚焦。有两个道具可以通过,但没有一个用于禁用此功能。我在他们的github中看到了与自动对焦相关的问题。但道具仍然没有添加到他们的包中。 我试过使用聚焦道具,但没有达到预期效果。 这是我选择下拉列表的代码 <Select className="profile-module-select-container" classNamePrefi

我在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})}
      />
{
这是我的国家({
选项选择:已选择。值
},()=>{onChange(this.state.optionSelect,formKey)});
}}
onMenuOpen={(e,i,o)=>{
这是我的国家({
选择菜单打开:true
});
}}
onMenuClose={()=>{
这是我的国家({
选择菜单打开:false
});
}}
组成部分={
{
指示符分隔符:()=>空,
下拉指示器:下拉插入符号,
占位符:自定义占位符,
选项:自定义选项组件
}
}
占位符={占位符}
isSearchable={false}
isClearable={false}
name={name}
value={options.filter(option=>{return option.value===value})
/>

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

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

对于功能组件和类型脚本,实现@tkamath99的解决方案,如下所示:

<Select
  ref={selectRef}

  onInputChange={value => {
    selectRef.current.select.getNextFocusedOption = () => false;
  }}
/>
{
selectRef.current.select.getNextFocusedOption=()=>false;
}}
/>