时间戳

首页 > 解决方案 > 有没有办法成功地将 Vue Storefront Nuxt 与 SSR 中的 Algolia 搜索路由集成？

vue.js - 有没有办法成功地将 Vue Storefront Nuxt 与 SSR 中的 Algolia 搜索路由集成？

问题描述

将Algolia 搜索与VSF/Next 分支集成，了解基础知识。继续路由。

使用Vanilla Nuxt，集成可以正常工作，尽管变通方法开始叠加。

复制：

  1. 拉 && 纱线 && 纱线运行开发
  2. http://192.168.1.4:3000/ && 搜索东西
  3. URL被重写

结帐VSF得到一个闪烁的重新渲染。

复制：

  1. 与上述相同，只是转到 /Search
  2. URL 被重写为 flash 然后渲染触发并返回到原始路由

我试过的：

  1. 单独构建两个存储库，这似乎不是 nuxt 本身的问题，更多的是 Vue StoreFront 的问题

参考： https ://github.com/algolia/vue-instantsearch/issues/916 （切线）

标签： vue.jsnuxt.jsserver-side-renderingalgoliavue-storefront

解决方案

Okee 这与通过路线的 nuxt comp 有关<nuxt :key="$route.fullPath"/>

我可以通过在默认模板中执行此操作来绕过它

    <div v-if="String($route.name) === 'Search___en'"><search/></div>
    <div v-else ><nuxt :key="$route.fullPath"/></div>

基本上用触发重新渲染的密钥绕过了comp，因为它使用了引擎盖下的路由器......我猜。

这最终使我能够有效地使用集成代码：https ://github.com/ed42311/algolia-vsf-routes/blob/main/layouts/default.vue#L11

虽然此解决方案有效，但其他建议表示赞赏。

推荐阅读