diff --git a/src/client/theme-default/components/NavBarLink.vue b/src/client/theme-default/components/NavBarLink.vue
index 2d3fab8e..a38ec86c 100644
--- a/src/client/theme-default/components/NavBarLink.vue
+++ b/src/client/theme-default/components/NavBarLink.vue
@@ -15,7 +15,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, defineOptions } from 'vue'
+import { computed, defineProps } from 'vue'
 import { useRoute } from 'vitepress'
 import { withBase, isExternal } from '../utils'
 import type { DefaultTheme } from '../config'
@@ -32,14 +32,10 @@ const normalizePath = (path: string): string => {
   return path
 }
 
-const { props } = defineOptions<{
-  props: {
-    item: DefaultTheme.NavItemWithLink
-  }
+const { item } = defineProps<{
+  item: DefaultTheme.NavItemWithLink
 }>()
 
-const item = props.item
-
 const route = useRoute()
 
 const classes = computed(() => ({
diff --git a/src/client/theme-default/components/NavDropdownLink.vue b/src/client/theme-default/components/NavDropdownLink.vue
index fe05ca82..83b0dae2 100644
--- a/src/client/theme-default/components/NavDropdownLink.vue
+++ b/src/client/theme-default/components/NavDropdownLink.vue
@@ -46,14 +46,12 @@
 
 <script setup lang="ts">
 import NavBarLink from './NavBarLink.vue'
-import { ref, watch, defineOptions } from 'vue'
+import { ref, watch, defineProps } from 'vue'
 import { useRoute } from 'vitepress'
 import type { DefaultTheme } from '../config'
 
-defineOptions<{
-  props: {
-    item: DefaultTheme.NavItemWithChildren
-  }
+defineProps<{
+  item: DefaultTheme.NavItemWithChildren
 }>()
 
 const open = ref(false)