Infinite Hits
The Hits
component displays a list of results from the current search.
Searchkit Setup
Within result_attributes
in search_settings
:
{
search_settings: {
result_attributes: ['title', 'description', 'image', 'price', 'url']
}
}
Usage
Below is an example of a hitView
that displays the product
attribute with the search query highlighted.
const hitView = ({ hit }) => {
return (
<div>
<img src={hit.image} />
<h2>{hit.title}</h2>
<p>{hit.description}</p>
<p>{hit.price}</p>
<p>{hit.url}</p>
</div>
)
}
const App = () => {
return (
<InstantSearch
searchClient={searchClient}
indexName="products"
>
<InfiniteHits hitComponent={hitView} />
</InstantSearch>
)
}