インライン目次

Install to your codebase

Easier customization & control.

npx @fumadocs/cli@latest add inline-toc

使い方

MDX コンテンツ内で使用できます。Fumadocs MDX の MDX ファイルでは、toc エクスポートはページの props を受け取る関数になります。

content.mdx

import { InlineTOC } from 'fumadocs-ui/components/inline-toc';

<InlineTOC items={toc(props)}>Table of Contents</InlineTOC>

または、すべてのページに追加することもできます。

page.tsx

import { DocsPage } from 'fumadocs-ui/layouts/docs/page';
import { InlineTOC } from 'fumadocs-ui/components/inline-toc';

export default function Page() {
  // ...
  return (
    <DocsPage>
      <InlineTOC items={page.data.toc}>Table of Contents</InlineTOC>
    </DocsPage>
  );
}

リファレンス

プロパティ

型

インライン目次

使い方アンカーリンクをコピー

リファレンスアンカーリンクをコピー

このページの内容

使い方

リファレンス