diff --git a/src/runtime/components/ContentNavigation.ts b/src/runtime/components/ContentNavigation.ts
index 95090840d..ab598ccb1 100644
--- a/src/runtime/components/ContentNavigation.ts
+++ b/src/runtime/components/ContentNavigation.ts
@@ -2,7 +2,7 @@ import { PropType, toRefs, defineComponent, h, useSlots, computed } from 'vue'
 import { hash } from 'ohash'
 import type { NavItem, QueryBuilderParams } from '../types'
 import { QueryBuilder } from '../types'
-import { useAsyncData, queryContent, fetchContentNavigation } from '#imports'
+import { useAsyncData, fetchContentNavigation } from '#imports'
 
 export default defineComponent({
   props: {
diff --git a/src/runtime/composables/navigation.ts b/src/runtime/composables/navigation.ts
index 933c715d7..1d236e886 100644
--- a/src/runtime/composables/navigation.ts
+++ b/src/runtime/composables/navigation.ts
@@ -1,11 +1,15 @@
 import { hash } from 'ohash'
 import { useHead, useCookie } from '#app'
-import type { NavItem, QueryBuilder } from '../types'
+import type { NavItem, QueryBuilder, QueryBuilderParams } from '../types'
 import { jsonStringify } from '../utils/json'
 import { withContentBase } from './utils'
 
-export const fetchContentNavigation = (queryBuilder?: QueryBuilder) => {
-  const params = queryBuilder?.params()
+export const fetchContentNavigation = (queryBuilder?: QueryBuilder | QueryBuilderParams) => {
+  let params = queryBuilder
+
+  // When params is an instance of QueryBuilder then we need to pick the params explicitly
+  if (typeof params?.params === 'function') { params = params.params() }
+
   const apiPath = withContentBase(params ? `/navigation/${hash(params)}` : '/navigation')
 
   if (!process.dev && process.server) {