API Reference
/
Vue InstantSearch
/
uiState
May. 12, 2022
uiState
About this widget
The uiState
object is created by InstantSearch internally. Every widget inside the library has its own way of updating it. To give you a sense of what each widget changes, here’s an example uiState
:
In the context of routing, the object shape of routeState
is completely up to you, but must be based on the keys in the uiState
. Please see the example implementation in our routing guide for details.
Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
const uiState = {
query: 'Hill Valley',
refinementList: {
colors: ['white', 'black']
},
configure: {
distinct: true,
},
menu: {
category: 'Decoration'
},
hierarchicalMenu: {
categories: ['Decoration > Clocks']
},
numericMenu: {
price: '100:500'
},
ratingMenu: {
rating: 4
},
range: {
ageInYears: '2:10'
},
toggle: {
freeShipping: true
},
geoSearch: {
boundingBox: '47.3165,4.9665,47.3424,5.0201'
},
sortBy: 'most_popular_index',
page: 2,
hitsPerPage: 20
};
Did you find this page helpful?