如何在Algolia每4次點擊後添加一個clearfix div？

Question

我們正在嘗試使用Algolia實現即時搜索。它像一個魅力。唯一的一點是我們希望在每4次點擊後添加一個clearfix div。現在它是

<div data-reactroot="" class="ais-hits"> 

    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 

</div> 

我想有一個clearfix DIV AFER每4個結果像這樣：

<div data-reactroot="" class="ais-hits"> 

    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div> 
    <div class="ais-hits--item"></div><div class="clearfix"></div> 
    <div class="ais-hits--item"></div> 

</div> 

這是產生點擊窗口小部件

search.addWidget(
    instantsearch.widgets.hits({ 
     container: '#booksearch', 
     templates: { 
      item: getTemplate('result') 
     }, 
     cssClasses: { 
      item: 'col-lg-3 col-md-3 col-sm-3' 
     }, 
     hitsPerPage: 12 
    }) 
); 

search.start(); 

謝謝你的代碼花時間閱讀本文。

Answer 1

InstantSearch小部件不提供該功能。

但是，您可以編寫自己的JS腳本，在HTML代碼的呈現（即生成）之後添加div。爲此，只需等待render事件被觸發。更多關於Events section of the InstantSearch documentation的信息。