UI libraries
/
Vue InstantSearch
/
Widgets
Dec. 04, 2023
simple
Signature
import { simple } from 'instantsearch.js/es/lib/stateMappings';
const routing = {
stateMapping: simple(),
};
About this widget
This simple state mapping is the default for the ais-instant-search wrapper’s routing prop.
The router provides an API that lets you customize some of its behaviors. To get a sense of what you can do with the API, see the Routing URLs guide.
The only transformation applied by the function is the omission of configure.
Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
import { simple } from 'instantsearch.js/es/lib/stateMappings';
simple().stateToRoute({
instant_search: {
query: 'Apple',
page: 5,
configure: {
hitsPerPage: 4,
},
},
});
// gives as output:
// {
// instant_search: {
// query: 'Apple',
// page: 5,
// },
// }
Examples
Copy
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<template>
<ais-instant-search
[...]
:routing="routing"
>
<!-- Widgets -->
</ais-instant-search>
</template>
<script>
import { simple } from 'instantsearch.js/es/lib/stateMappings';
export default {
data() {
return {
// ...
routing: {
stateMapping: simple()
},
};
}
};
</script>
Did you find this page helpful?
