48 lines
1.4 KiB
Vue
48 lines
1.4 KiB
Vue
<template>
|
||
<div>
|
||
<UContentNavigation
|
||
:navigation="directoryNavigation"
|
||
highlight
|
||
color="primary"
|
||
variant="pill"
|
||
/>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import type { ContentNavigationItem } from '@nuxt/content'
|
||
|
||
// 获取导航数据
|
||
const navigation = inject<Ref<ContentNavigationItem[]>>('navigation')
|
||
|
||
// 处理导航数据，只显示一级目录和根目录文件
|
||
const directoryNavigation = computed(() => {
|
||
if (!navigation?.value) return []
|
||
|
||
return navigation.value.map(item => {
|
||
// 如果是根目录文件（没有 children），直接返回
|
||
if (!item.children || item.children.length === 0) {
|
||
return {
|
||
title: item.title,
|
||
path: item.path,
|
||
icon: (item.icon as string) || 'lucide-file-text',
|
||
active: Boolean(item.active)
|
||
}
|
||
}
|
||
|
||
// 如果是一级目录，只保留目录本身，不显示子项
|
||
return {
|
||
title: item.title,
|
||
path: item.path,
|
||
icon: (item.icon as string) || 'lucide-folder',
|
||
active: Boolean(item.active),
|
||
// 不包含 children，这样就不会展开显示子项
|
||
children: []
|
||
}
|
||
}).filter(item => item.title && item.path) // 过滤掉空项
|
||
})
|
||
|
||
// 调试信息
|
||
// console.log('ContentDirectory: Navigation data:', navigation.value)
|
||
// console.log('ContentDirectory: Processed navigation:', directoryNavigation.value)
|
||
</script> |