connectors connectHits

Description

Hits connector provides the logic to create custom widgets that will render the results retrieved from Algolia.

Usage

const search= instantsearch(/* parameters */);

const makeHits= instantsearch.connectors.connectHits(
  function renderFn(
      renderOpts: HitsRenderingOptions,
      isFirstRendering: boolean) {
    // render the custom Hits widget
  }
);

const  customHits = makeHits(instanceOpts: CustomHitsWidgetOptions);
search.addWidget(customHits);

Connector options

HitsRenderingOptions

• hitsArray<Object>

  The matched hits from Algolia API.

• resultsObject

  The complete results response from Algolia API.

• widgetParamsObject

  All original widget options forwarded to the renderFn.

CustomHitsWidgetOptions

• escapeHTML[boolean]
  Default value: true

  Whether to escape HTML tags from hits[i]._highlightResult.

• transformItems[(Array<Object>) => Array<Object>]

  Function to transform the items passed to the templates.

Example

// custom `renderFn` to render the custom Hits widget
function renderFn(HitsRenderingOptions) {
  HitsRenderingOptions.widgetParams.containerNode.html(
    HitsRenderingOptions.hits.map(function(hit) {
      return '<div>' + hit._highlightResult.name.value + '</div>';
    })
  );
}

// connect `renderFn` to Hits logic
var customHits = instantsearch.connectors.connectHits(renderFn);

// mount widget on the page
search.addWidget(
  customHits({
    containerNode: $('#custom-hits-container'),
  })
);

Can't find what you are looking for? Open an issue, we'll get back to you.