頁面樹

頁面樹是一種樹狀結構，用來描述所有導覽連結，以及分隔符、資料夾等其他項目。

頁面樹會傳送到用戶端，供側邊欄和 Breadcrumb 等導覽元素引用。因此，請勿在頁面樹中存放任何敏感或大型的資料。

注意

頁面樹在設計上只會包含所有頁面與資料夾的必要資訊。

無法序列化的資料 (例如函式) 無法傳入頁面樹。

慣例

您可以匯入頁面樹的型別定義，若您想以寫死的方式定義或自動產生頁面樹，這會相當實用。

import type * as PageTree from 'fumadocs-core/page-tree';

const tree: PageTree.Root = {
  // props
};

部分節點包含 $ref 屬性，這類屬性僅供內部使用，以寫死 (hardcode) 方式定義時不需要用到。

頁面樹的初始根節點。

屬性

型別

代表連結的節點。

{
  "type": "page",
  "name": "Quick Start",
  "url": "/docs"
}

也支援外部 URL

屬性

型別

包含多個子節點的節點。

{
    "type": "folder",
    "name": "Guide",
    "index": {
        "type": "page",
        ...
    }
    "children": [
        ...
    ]
}

屬性

型別

位於項目之間的標籤。

{
  "type": "separator",
  "name": "Components"
}

屬性

型別

圖示的型別為 ReactElement，頁面與資料夾皆可設定。