动态更改 searchFunction

change searchFunction dynamically

上下文:我正在尝试将多个索引绑定到一个搜索框

我有一个索引数组,我想编辑第一个索引的 searchFunction

const indexes = indexNames.map( name => return createAlgoliaIndex(name) )
const main = indexes[0]

main.searchFunction = (helper) => {
  indexes.forEach( (algoliaIndex, index) => {
    if (index === 0)
      return;

    algoliaIndex.helper.setQuery(helper.state.query).search()
  })

  helper.search()
}

createAlgoliaIndexFor(name) {
  return instantsearch({
    indexName: name,
    searchClient
  })
}

基本不行:(

有什么想法吗?

您显然没有选择:必须在初始化时传递 searchFunction 选项。

这是一个工作示例(抱歉,代码有点乱):

const searchClient = algoliasearch('1KCCSVLJHD', '0fb99058412c4776c60725c0fe9b2d7d');

const indexes = ["test", "test2"].map((name, idx) => {
  const searchFunction = idx !== 0 ? null : (helper) => {
    indexes.forEach((algoliaIndex, index) => {
      if (index === 0) {
        return;
      }

      algoliaIndex.helper.setQuery(helper.state.query).search()
    });

    helper.search();
  };

  return instantsearch({
    indexName: name,
    searchFunction,
    searchClient
  })
});


indexes[0].addWidget(instantsearch.widgets.searchBox({
  container: '.search-box'
}));
indexes[0].addWidget(instantsearch.widgets.hits({
  container: '.hits-1'
}));
indexes[1].addWidget(instantsearch.widgets.hits({
  container: '.hits-2'
}));


for (var i = indexes.length - 1; i >= 0; i--) {
  indexes[i].start();
}
<script src="https://cdn.jsdelivr.net/npm/algoliasearch@3.32.1/dist/algoliasearchLite.js"></script>
<script src="https://cdn.jsdelivr.net/npm/instantsearch.js@3.2.0"></script>
<div class="search-box"></div>

<h1>First index</h1>
<div class="hits-1"></div>

<h1>Second index</h1>
<div class="hits-2"></div>

这基本上就是您正在做的,但是 searchFunction 直接传递给 instantsearch 初始化函数,仅用于第一个(主要)索引。

请注意,因为在即时搜索实例上调用 start 会立即调用 search,因此会调用 searchFunction,因此您必须最后启动主实例,以便 helper存在于其他实例上。