ReactiveSearch仅自动完成

Question

我只想将ReactiveSearch库用于自动完成提交。

 const Search = () => ( <div className="search-field"> <ReactiveBase app="good-books-ds" credentials="nY6NNTZZ6:27b76b9f-18ea-456c-bc5e-3a5263ebc63d" > <div className="row"> <div className="col"> <DataSearch dataField={['original_title', 'original_title.search']} categoryField="authors.raw" componentId="BookSensor" /> </div> </div> </ReactiveBase> </div> ) export default Search 

我尝试使用<DataSearch ... />进行上述输入，并且可以使用，但没有提交选项。 我试图用表格包装它，但是在输入或选择值后它不会触发。

有什么建议么？

Answer 1

https://opensource.appbase.io/reactive-manual/search-components/datasearch.html

您需要仔细阅读文档，其中包含onValueChange处理函数，因此当您键入某些内容时，您可以先设置状态，然后在数据搜索道具中的顶部将初始状态设置为state = {searchText: ""} ，然后再执行以下操作

<DataSearch onValueChange = {(e) => this.setState({searchText: value})} />

现在使您拥有自己的按钮，并以状态this.state.searchText提交值

Answer 2

ReactiveSearch现在支持onValueSelected道具，该道具非常适合您仅对利用所选值感兴趣的用例（选择建议或按Enter键）。 文档和示例用法：

<DataSearch
  ...
  onValueSelected={(value) => console.log('The selected value is', value)}
/>