refactor: build router links directly from router config
This commit is contained in:
parent
7bd86d73e6
commit
eeb5ece970
1 changed files with 4 additions and 14 deletions
|
@ -1,4 +1,5 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import router from "@/router";
|
||||||
import { RouterLink } from "vue-router";
|
import { RouterLink } from "vue-router";
|
||||||
import NavToggle from "@/components/NavToggle.vue";
|
import NavToggle from "@/components/NavToggle.vue";
|
||||||
|
|
||||||
|
@ -6,17 +7,6 @@ interface Props {
|
||||||
isActive: boolean;
|
isActive: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Route {
|
|
||||||
href: string;
|
|
||||||
title: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const routerLinks: Array<Route> = [
|
|
||||||
{ href: "/", title: "Home" },
|
|
||||||
{ href: "/anatomy", title: "Anatomy" },
|
|
||||||
{ href: "/career-path", title: "Career Path" },
|
|
||||||
];
|
|
||||||
|
|
||||||
const props = defineProps<Props>();
|
const props = defineProps<Props>();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -29,11 +19,11 @@ const props = defineProps<Props>();
|
||||||
<ul class="navigation__list">
|
<ul class="navigation__list">
|
||||||
<li
|
<li
|
||||||
class="navigation__item"
|
class="navigation__item"
|
||||||
v-for="(route, idx) in routerLinks"
|
v-for="(route, idx) in router.options.routes"
|
||||||
:key="idx"
|
:key="idx"
|
||||||
>
|
>
|
||||||
<RouterLink :to="route.href" @click="$emit('selected')">
|
<RouterLink :to="route.path" @click="$emit('selected')">
|
||||||
{{ route.title }}
|
{{ route.meta?.title }}
|
||||||
</RouterLink>
|
</RouterLink>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue