问题标签 [vue-instant-search]

我的应用程序中有以下组件：

我想观察这个属性的变化，并在我的页面发生变化时对其进行全局更改。

例如：

有没有办法将观察者添加到搜索属性，或者有没有办法在属性更改时触发事件？

ais-menu 文档显示了您可以为组件设置的属性，但似乎没有任何可以监听的事件，或者设置观察者的示例。

同样，我想知道整个组件上是否有可用的东西，<ais-instant-search>但我在文档中找不到任何东西。

这个问题是指一个'searchStore._results'属性，但后来的评论者说它不再有效。

完整代码如下：

我有一个 Algolia细化列表，但每次我在它周围切换一个类时，查询都会消失。我无法弄清楚是什么在重置这些值。

这是我当前的示例：

在这里演示： https ://codesandbox.io/s/vue-template-z5woy

我正在尝试为Vue修改InstantSearch小部件的输出。

在文档（https://www.algolia.com/doc/api-reference/widgets/hits/vue/#customize-the-ui）中，它说使用 scope-slot 它将覆盖完整的 DOM 输出小部件：

但这里似乎并非如此。这是我在下面使用带有简单<tr>和<td>元素的插槽的代码：

我没有在其中渲染 a <tr>，而是<td>在这里看到：

• 具有ais-Hits类的div
• 具有ais-Hits-list类的嵌套ol
• 具有ais-Hits-item类的嵌套li

输出是这样的：

如果我去检查元素并删除上面提到的元素（查看如何删除div、ol和li）：

那么结果是正确的：

难道我做错了什么？slot 不应该覆盖 DOM 输出并将其余部分留给开发人员来设置样式吗？

任何帮助将非常感激！

我一定是错过了什么。

任何人都可以建议如何摆脱右边的块（见屏幕截图）？我只是希望搜索框显示全宽和某种原因（我不知道为什么）它被压缩在左侧的块中。

我正在开发一个 Gridsome 应用程序（使用 Vue 构建的 SSG）。我添加了一个搜索页面，并使用自动完成小部件实现了 Algolia 即时搜索。

默认情况下，Gridsome 会延迟加载路由并在服务器端呈现页面，并且由于我使用的即时搜索组件不支持 SSR，因此我将其包装在一个<ClientOnly>组件中。

问题

当我导航到/search它需要一段时间才能渲染组件时，这是因为我立即导航到页面，执行获取内容的脚本会阻塞渲染直到完成。导致糟糕的用户体验。

编码

我想要的是

我希望仅在用户开始输入时进行查询，这样就不会阻止渲染。

我正在尝试在网站中使用 vue 实现 algolia，并且它在大多数情况下都可以正常工作，但是每次我尝试使用自定义input字段执行搜索时，每次击键都会触发两次，这会导致我们的搜索操作在每次使用时加倍在网站上。

例如，有问题的代码如下所示：

HTML

JS

如果您打开“网络”选项卡并尝试在该<input v-model="query" />字段中输入，您将看到 2 个请求发送到 Algolia，但是在该 <ais-search-box>字段中执行相同操作会显示每个预期按键的单个请求。

有没有办法在ais-search-box我的输入字段中实现相同的行为？我不能在我们的网站中使用这个字段的原因是因为我们网站中的搜索字段在 vue 实例之外，我必须vm.query = 'query'在输入这个字段时设置查询。这是一个没有帮助的旧网站，我的选择非常有限。

这是使用 Algolia 的测试凭据的 codepen 中的相同示例：https ://codepen.io/javier_ml/pen/RwNzWRZ

我想实现快速、流畅的搜索。搜索到的项目并不多：最多约 100 个。每个项目都包含 facebook 事件将包含的数据量。它们都会在初始加载时出现（可能是无限滚动）。数据不会经常变化。不超过 100 个并发用户。

在上述条件下，搜索结果的最佳缓存策略是什么？

最具扩展性的策略是什么？

堆

• 前端：Nuxt (VueJS) + InstantSearch（没有 Algolia！）
• 后端：春季启动
• 码头化

可能的解决方案

1. 后端的额外缓存服务（例如 reddis、memcached）+ 使 UI 在每次搜索操作时都转到服务器。这基本上会在每次击键时向后端发送垃圾邮件
2. 将所有项目加载到本地存储（例如Vuex）并直接在那里搜索。这将增加应用程序的内存占用，并可能导致混乱的超时。
3. 两者的结合？

我们正在使用来自 Algolia 的 vue Instantsearch。

当用户使用一些初始 url 参数登陆页面时，algolia instantsearch 会加载初始搜索，并更改 url 以包含搜索参数。但是，当 algolia 重写 url 时，初始 url 参数不会保留，我们希望它们保留。即。

• 落在/stuff?myparam=value
• algolia 设置初始搜索结果并将 url 更改为并删除/stuff?refinementList=...url 参数。myparam有没有办法将其保留在网址中？

我想弄清楚如何在空搜索查询中隐藏索引/结果。

在我的刀片中，我有代码（从官方文档略有修改）：

如果我输入搜索查询，这可以正常工作，但在空查询时，这会在我的页面上显示以下不需要的通知（而不是之前不需要的索引）：

如何隐藏此通知？

I would like to add a ref='foo' to the <ais-search-box> element (to the rendered input field), so I can then dynamically put .focus on it if needed. But how can I add the ref=[..]? My current code is:

But this is not working, the final rendered element does not contain any ref= info: