reactjs - ReactiveSearch，DataSearch和索引用户查询

Question

我将Reactivesearch的DataSearch用于自动完成功能，并且试图弄清楚如何接受用户选择的查询并将其添加到Appbaseio托管的自动完成索引中？

当我说用户的选定查询时，我的意思是键入一个查询或从DataSearch组件下拉列表中选择一个查询。

到目前为止，这是我想出的

<DataSearch
   componentId="SearchSensor"
   dataField={["original_title"]}
   className="search-bar"
   onValueSelected={
     function(value, cause, source) {
       console.log("current value: ", value)
     }
   }
   iconPosition="right"
   innerclassName={{
     list: "text-item"
   }}
   />

上面的onValueSelected直接来自 docs。看来这是我需要处理的属性。我只是不确定如何将其连接到我的Appbaseio ES索引？

Answer 1

onValueSelected是在此处获取所选值的正确方法。 (如果需要，您还可以使用onQueryChange获取完整查询)。在onValueSelected中获得此选定值后，您可以使用简单的fetch请求将此值编入您的elasticsearch索引中，或将其发送到后端。您还可以尝试使用helper library和docs进行休息。

另外，我建议将索引逻辑拉到服务器，而不要在客户端公开，因为您需要写凭据才能执行写操作。这样可以使您的写凭据更安全。

例如:

<DataSearch
  ...
  onValueSelected={(value) => {
    fetch('YOUR_SERVER_URL' or 'Elasticsearch URL', { method: 'POST', body: {...} })
  }
/>