仅限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 ... />进行上述输入，但它没有提交选项。我试图用form包装它，但在输入或选择value之后，它不会触发。

有什么建议吗？

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键)。Docs和示例用法：

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