debian-mirror-gitlab/app/assets/javascripts/vue_shared/components/url_sync.vue

40 lines
906 B
Vue
Raw Normal View History

2020-06-23 00:09:42 +05:30
<script>
import { historyPushState } from '~/lib/utils/common_utils';
2020-11-24 15:15:51 +05:30
import { mergeUrlParams } from '~/lib/utils/url_utility';
2020-06-23 00:09:42 +05:30
2021-04-29 21:17:54 +05:30
/**
* 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.
*/
2020-06-23 00:09:42 +05:30
export default {
props: {
query: {
type: Object,
2021-04-29 21:17:54 +05:30
required: false,
default: null,
2020-06-23 00:09:42 +05:30
},
},
watch: {
query: {
immediate: true,
deep: true,
handler(newQuery) {
2021-04-29 21:17:54 +05:30
if (newQuery) {
this.updateQuery(newQuery);
}
2020-06-23 00:09:42 +05:30
},
},
},
2021-04-29 21:17:54 +05:30
methods: {
updateQuery(newQuery) {
historyPushState(mergeUrlParams(newQuery, window.location.href, { spreadArrays: true }));
},
},
2020-06-23 00:09:42 +05:30
render() {
2021-04-29 21:17:54 +05:30
return this.$scopedSlots.default?.({ updateQuery: this.updateQuery });
2020-06-23 00:09:42 +05:30
},
};
</script>