如何禁用Algolia默认自动填充结果，仅在按键搜索时返回结果？

根据你遇到的问题，以下是不同实现场景下的解决方法：

场景1：使用InstantSearch.js #

如果你的项目基于InstantSearch.js，需要调整搜索框组件的配置，避免初始加载时自动执行搜索，同时控制仅在用户输入后触发搜索：

• 配置searchBox组件时，设置searchAsYouType: false，这样只有用户点击搜索按钮或按下回车键时才会触发搜索；
• 若仍存在初始自动填充，需确保没有在初始化时主动调用search()方法，并且将autofocus设为false，防止页面加载时搜索框自动获取焦点触发搜索。

示例代码：

search.addWidgets([
  instantsearch.widgets.searchBox({
    container: '#search-box',
    searchAsYouType: false,
    autofocus: false,
  })
]);

场景2：使用Algolia Autocomplete.js #

如果使用的是独立的Autocomplete.js，需要修改初始化配置，禁止焦点触发下拉列表，且仅在用户输入内容后执行搜索：

• 设置openOnFocus: false，避免搜索框获得焦点时自动弹出结果；
• 在getSources的回调中，判断输入内容长度，仅当内容不为空时才发起Algolia请求。

示例代码：

autocomplete('#search-input', { openOnFocus: false }, [
  {
    getSources({ query }) {
      if (!query.trim()) return [];
      return [
        {
          source: autocomplete.sources.hits(index, { hitsPerPage: 5 }),
          // 其余渲染配置...
        }
      ];
    },
    // 其余渲染配置...
  }
]);

额外检查点 #

• 检查Algolia控制台的索引设置，确认是否开启了默认触发的自动推荐功能（比如Query Suggestions），如有可调整相关规则；
• 排查页面初始化代码，确保没有手动执行传入空字符串的index.search()请求。

内容的提问来源于stack exchange，提问作者Taio