algolia Instantsearchjs 如何在电子商务网站上使用 <Searchbox> 全局显示和搜索

Question

我正在使用 instantsearch.js，我的网站是 laravel 中的电子商务应用程序，而 algolia 在点击页面上运行完美。

我的主要问题是如何在其他网页（主页、静态等）中实现 SearchBox 以允许人们在 header 搜索框上书写以及当他们按下回车键时-> 被转发到我的搜索结果页面（例如：www.example.com/search/query?q=apple）

考虑到我完全使用 instantsearch.js，我在 laravel 中的控制器和路由没有将任何变量传递到该视图。

提前致谢。

Answer 1

据我了解，您想为您的视图创建一个全局变量..

好吧，您可以为此使用视图作曲家，将其添加到您的 AppServiceProvider

 public function boot()
    {
        View::share('key', 'value');
    }

更多信息可以看docs

Answer 2

最后，对于静态页面或所有其他页面，我使用了类似的东西：

<input id="myInput" value="Some text..">
<button id="myBtn" onclick="javascript:alert('Hello World!')">Button</button>

<script>
var input = document.getElementById("myInput");
input.addEventListener("keyup", function(event) {
    event.preventDefault();
    if (event.keyCode === 13) {
        document.getElementById("myBtn").click();
    }
});
</script>

algolia Instantsearchjs 如何在电子商务网站上使用 <Searchbox> 全局显示和搜索

algolia Instantsearchjs how to display and search using <Searchbox> globally on an ecommerce website

javascript

laravel-5

algolia

instantsearch.js