React Semantic UI : 드롭 다운 요소의 입력 필드에 포커스를 설정하는 방법

Question

Dropdown 요소의 입력 필드에 포커스를 처음 설정할 수 있습니까? 그래서

<Dropdown 
    name={name} 
    placeholder='Select type' 
    search 
    searchInput={{ type: 'text' }} 
    selection 
    onChange={this.handleChange} 
    options={options} 
/> 

사용자가 드롭 다운 입력 필드를 클릭 할 필요없이 검색/입력을 시작 할 수 있어야한다 ...

Answer 1

질문을 올바르게 이해하면 콘텐츠를로드 할 때 드롭 다운 구성 요소에 포커스를 둡니다.

실제로 그렇다면 Refs를 사용하고 싶습니다. 참조 자세한 예를 들면 다음과 같습니다 특히 Refs and the DOM

:

이 경우 참고 문헌을 사용하는

몇 가지 좋은 사용 사례는 심판에 대한 있습니다

• 포커스 관리, 텍스트 선택 또는 미디어 재생.
• 명령형 애니메이션 트리거.
• 타사 DOM 라이브러리와 통합.

Answer 2

나는 당신의 설명을

var searchNames = ['Sydney', 'Melbourne', 'Brisbane', 
    'Adelaide', 'Perth', 'Hobart']; 
//... 
<DropdownInput 
    options={searchNames} 
    defaultValue={this.props.initialValue} // This is what you need 
    menuClassName='dropdown-input' 
    onSelect={this.handleSelectName} 
    placeholder='Search...' 
/> 

그러나 일치 react-dropdown-input 발견 이 의존성에 대한 마지막 커밋은 2 년 전이었습니다.

더 유명하고 업데이트 된 것으로 보이는 react-dropdown이 있습니다. 그것은에서 이전

수입 드롭 다운 유사한 작동 const를 defaultOption = 옵션 '- 드롭 다운 반응'[0] 내가 그리워 생각 귀하의 질문을 이해하고 내 대답을 삭제 번째를 들어

import Dropdown from 'react-dropdown' 
const defaultOption = options[0] 
<Dropdown 
    options={options} 
    onChange={this._onSelect} 
    value={defaultOption} // This is what you need 
    placeholder="Select an option" 
/> 

. 그럼 다시 (두 번) 귀하의 질문을 읽고 나는 이것이 당신이 찾고있는 대답이라고 생각합니다. 이 문제가 해결되면 알려 주시기 바랍니다.