Widgets InfiniteHits


Displays an infinite list of hits along with a load more button.

To configure the number of hits being shown, use the HitsPerPage widget, connectHitsPerPage connector or the Configure widget.


type: Component 

Component used for rendering each hit from the results. If it is not provided the rendering defaults to displaying the hit in its JSON form. The component will be called with a hit prop.

Example usage

import React from 'react'; import { InstantSearch, InfiniteHits } from 'react-instantsearch-dom'; const App = () => ( <InstantSearch appId="latency" apiKey="6be0576ff61c053d5f9a3225e2a90f76" indexName="instant_search" > <InfiniteHits /> </InstantSearch> );

CSS classes

.ais-InfiniteHits {}

the root div of the widget

.ais-InfiniteHits-list {}

the list of hits

.ais-InfiniteHits-item {}

the hit list item

.ais-InfiniteHits-loadMore {}

the button used to display more results

.ais-InfiniteHits-loadMore--disabled {}

the disabled button used to display more results

Translation keys


the label of load more button