reactjs - 如何在 Semantic UI React 中以编程方式聚焦 Search 组件？

Question

正如问题说明了一切，我无法专注于语义 UI Search以编程方式组件。

我试过:

<Search
     category
     fluid
     loading={isItemLoading}
     onResultSelect={this.handleItemResultSelect}
     onSearchChange={this.handleItemSearchChange}
     placeholder='Search by name'
     results={itemResults}
     value={itemValue}
     ref={input => { this.itemSearch = input; }} />

和

this.itemSearch.setState({ focus: true, open: true });

这会打开结果，但不会集中输入供用户重新键入。

Answer 1

对于那些偶然发现这个老问题的人:搜索现在有输入 Prop 。
看起来它接受与语义输入组件相同的 Prop 。像这样获取搜索的输入引用:

<Search input={{ref: r => this.searchInputRef = r}} />

然后像这样使用它:

focusSearchInput() {
  if (this.searchInputRef.focus) {
    this.searchInputRef.focus();
  }
}

这个对我有用