使用 Algolia instantsearch.js 有选择地使用不同的范围滑块

Question

使用 Algolia Instantsearch.js 我希望根据查询字符串中传递的 country_code 参数的值有选择地使用不同的 rangeSliders。

如果例如：country_code 是 'FR' 我想使用 total_area_meters 范围滑块，并使用另一个使用欧元的范围滑块。对于 'UK' 我想使用 total_area_ft 和另一个使用磅的范围滑块。

虽然我正在等待（并希望）https://github.com/algolia/instantsearch.js/issues/753 to be implemented, I've been told by Algolia support personnel that it's potentially possible to use the helper library: https://github.com/algolia/algoliasearch-helper-js 让它工作。

我有，例如：尝试使用以下方法选择性地启用析取面：

search.addWidget({
  init: function (opts) {
    // opts.helper contains the underlying algoliasearchHelper
    if(detected_locale === 'fr'){
        opts.helper.setQueryParameter('disjunctiveFacets', [
            'total_area_meters','price_eur'
            ]); 
//...

虽然这样做还不够：除其他问题外，页面上仍然有滑块小部件，例如：需要'total_area_feet，和 'price_gbp' 会引发 javascript 错误 - 我需要以某种方式禁用它们，并且还有一些非常突兀的 url 需要有选择地删除。

例如：如果我的析取面是：total_area_meters：我得到这样的 url：

&nR[total_area_meters][>=][0]=135&nR[total_area_meters][<=][0]=770 - 当我有一个使用脚的 country_code 时，需要将其删除。

所以我的问题是：

有没有办法通过 js 以编程方式选择性地 enable/disable instantsearch.js rangeslider 小部件？（或者我可以以某种方式以编程方式设置它们的值/重置它们以便它们没有查询参数吗？）
如果上面的解决方案没有涉及，是否有任何预建函数可以让我清理 rangeslider url 参数？谢谢！

Answer 1

在 Algolia 的 Tim Carry 的帮助下，我能够 work-around 工作。它并不完美，但简而言之，我首先将所有滑块添加到页面中。然后我有选择地隐藏它们使用：

.hideClass { 
    display: none; 
}
$sliders[i].addClass('hideClass');
// or
$sliders[i].removeClass('hideClass');

这比以下表现要好得多：

$sliders[i].show()
//and
$sliders[i].hide()

取决于url中的country_code。我发现（不幸的是）有必要在每次渲染调用时 re-issue hiding/showing 命令（不仅仅是 init()），例如：

search.addWidget( {
  render: function(opts) {
    show_hide_sliders();
  }
});

可以使用以下方法删除滑块的所有 url 参数：

helper.removeNumericRefinement(slider_attribute[i]);

只有在发生 country_code 更改时才会发布。它 pretty-much 似乎起作用了（尽管警告：到目前为止只进行了有限的测试）。希望这对某人有帮助。

编辑：为了回应评论，请注意：在这种情况下，我通过使用 opts.helper 获得了助手的句柄（但我可能也使用 search.helper 成功了。）。例如：

search.addWidget( {
  render: function(opts) {
    show_hide_sliders();
    opts.helper. ... // add your helper methods...
  }
});

使用 Algolia instantsearch.js 有选择地使用不同的范围滑块

selectively using different range sliders using Algolia instantsearch.js

javascript

algolia