React InstantSearch FAQ
On this page
How to use float values in a rating menu widget?
The ratingMenu
doesn’t support float values. We recommend storing an integer representation of this value in your records (e.g., 0.5 * 10 = 5) and display the original value in your UI.
How to search from the n-th character?
To search only when the query is longer than a certain length, you can implement a proxy search client. Then, you can add a condition (e.g., query.length > 3
).
How do I implement a “Show more” feature on a custom RefinementList
?
A custom RefinementList
widget will show up to showMoreLimit
refinement items in items
. It lets you sort the items as you want before they’re trimmed. However, it means you need to slice to the desired limit, and keep track of isShowingMore
in local state:
1
2
3
4
5
6
7
8
9
10
11
12
13
const CustomRefinementList = connectRefinementList(function RefinementList({
items,
limit,
showMoreLimit
}) {
const [isShowingMore, toggleShowMore] = React.useState(false)
const itemsToDisplay = items.slice(
0,
isShowingMore ? showMoreLimit : limit
)
// render using `itemsToDisplay`
})
Why is my searchState
ignored?
The uiState
works only when the widgets responsible for each UI state attribute is mounted. For instance, a SearchBox
widget is necessary to provide a query
.