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
34
35
36
37
38
39
|
<script>
import { historyPushState } from '~/lib/utils/common_utils';
import { mergeUrlParams } from '~/lib/utils/url_utility';
/**
* Renderless component to update the query string,
* the update is done by updating the query property or
* by using updateQuery method in the scoped slot.
* note: do not use both prop and updateQuery method.
*/
export default {
props: {
query: {
type: Object,
required: false,
default: null,
},
},
watch: {
query: {
immediate: true,
deep: true,
handler(newQuery) {
if (newQuery) {
this.updateQuery(newQuery);
}
},
},
},
methods: {
updateQuery(newQuery) {
historyPushState(mergeUrlParams(newQuery, window.location.href, { spreadArrays: true }));
},
},
render() {
return this.$scopedSlots.default?.({ updateQuery: this.updateQuery });
},
};
</script>
|
