FoundKey/packages/client/src/components/global/router-view.vue
Johann150 5b4c0ffdf3
client: fix some lints
Mostly focused on "@typescript-eslint/no-unused-vars" but also fixed some
other lints along the way.
2022-08-12 08:35:22 +02:00

44 lines
1 KiB
Vue

<template>
<KeepAlive :max="defaultStore.state.numberOfPageCache">
<Suspense>
<component :is="currentPageComponent" :key="key" v-bind="Object.fromEntries(currentPageProps)"/>
<template #fallback>
Loading...
</template>
</Suspense>
</KeepAlive>
</template>
<script lang="ts" setup>
import { inject, onUnmounted, watch } from 'vue';
import { Router } from '@/nirax';
import { defaultStore } from '@/store';
const props = defineProps<{
router?: Router;
}>();
const router = props.router ?? inject('router');
if (router == null) {
throw new Error('no router provided');
}
let currentPageComponent = $shallowRef(router.getCurrentComponent());
let currentPageProps = $ref(router.getCurrentProps());
let key = $ref(router.getCurrentKey());
function onChange({ route, props: newProps, key: newKey }): void {
currentPageComponent = route.component;
currentPageProps = newProps;
key = newKey;
}
router.addListener('change', onChange);
onUnmounted(() => {
router.removeListener('change', onChange);
});
</script>