diff --git a/plugins/plugin-md-power/src/client/components/FileTreeItem.vue b/plugins/plugin-md-power/src/client/components/FileTreeItem.vue
index 217c2fce..6483b6be 100644
--- a/plugins/plugin-md-power/src/client/components/FileTreeItem.vue
+++ b/plugins/plugin-md-power/src/client/components/FileTreeItem.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref } from 'vue'
 
 const props = defineProps<{
   type: 'file' | 'folder'
@@ -10,13 +10,22 @@ const props = defineProps<{
 const active = ref(!!props.expanded)
 const el = ref<HTMLElement>()
 
+function toggle() {
+  active.value = !active.value
+}
+
 onMounted(() => {
   if (!el.value || props.type !== 'folder')
     return
 
-  el.value.querySelector('.tree-node.folder')?.addEventListener('click', () => {
-    active.value = !active.value
-  })
+  el.value.querySelector('.tree-node.folder')?.addEventListener('click', toggle)
+})
+
+onUnmounted(() => {
+  if (!el.value || props.type !== 'folder')
+    return
+
+  el.value.querySelector('.tree-node.folder')?.removeEventListener('click', toggle)
 })
 </script>
 
@@ -45,6 +54,15 @@ onMounted(() => {
   transition: border var(--t-color), background-color var(--t-color);
 }
 
+.vp-file-tree .vp-file-tree-title {
+  padding-left: 16px;
+  margin: -16px -16px 0;
+  font-weight: bold;
+  color: var(--vp-c-text-1);
+  border-bottom: solid 1px var(--vp-c-divider);
+  transition: color var(--t-color), border-color var(--t-color);
+}
+
 .vp-file-tree ul {
   padding: 0 !important;
   margin: 0 !important;
diff --git a/plugins/plugin-md-power/src/node/features/fileTree/index.ts b/plugins/plugin-md-power/src/node/features/fileTree/index.ts
index 8693dfef..7508b1d5 100644
--- a/plugins/plugin-md-power/src/node/features/fileTree/index.ts
+++ b/plugins/plugin-md-power/src/node/features/fileTree/index.ts
@@ -46,7 +46,10 @@ export async function fileTreePlugin(app: App, md: Markdown) {
           token.tag = componentName
         }
       }
-      return '<div class="vp-file-tree">'
+      const info = tokens[idx].info.trim()
+
+      const title = info.slice(type.length).trim()
+      return `<div class="vp-file-tree">${title ? `<p class="vp-file-tree-title">${title}</p>` : ''}`
     }
     else {
       return '</div>'