chore: on example, use composable for route to fix highlight bug

rotki · Sep 4, 2023 · 986902b · 986902b
1 parent 6f350d4
commit 986902b
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/example/src/components/AppFootNav.vue b/example/src/components/AppFootNav.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { computed, toRefs, useCssModule } from 'vue';
 import { get } from '@vueuse/shared';
+import { useRoute } from 'vue-router/composables';
 import { type SideNavLink } from '@/types';
-import router from '@/router';
 
 const props = defineProps<{
   navigation: Array<{
@@ -11,15 +11,15 @@ const props = defineProps<{
   }>;
 }>();
 
-const route = computed(() => router.currentRoute);
+const route = useRoute();
 const css = useCssModule();
 
 const { navigation } = toRefs(props);
 const links = computed(() =>
   get(navigation).flatMap((section) => section.links),
 );
 const currentPage = computed(() =>
-  get(links).find((link) => link.to.name === route.value.name),
+  get(links).find((link) => link.to.name === route.name),
 );
 const currentPageIndex = computed(() => {
   const current = get(currentPage);

diff --git a/example/src/components/AppSideNav.vue b/example/src/components/AppSideNav.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { computed, useCssModule } from 'vue';
+import { useCssModule } from 'vue';
+import { useRoute } from 'vue-router/composables';
 import { type SideNavLink } from '@/types';
-import router from '@/router';
 
 defineProps<{
   navigation: Array<{
@@ -10,7 +10,7 @@ defineProps<{
   }>;
 }>();
 
-const route = computed(() => router.currentRoute);
+const route = useRoute();
 const css = useCssModule();
 </script>