Skip to main content

Module post_toc

Module post_toc 

Source
Expand description

文章目录组件。 文章目录组件

同一个 nav.toc-sidebar 在两种宽度下换形态(CSS 媒体查询,断点 1100px):

  • 宽屏且位于 .post-layout 内:正文右侧吸顶目录,当前小节以 Clay 圆点标示, 列表两端滚动渐隐,底部显示「已读 N%」与进度条。
  • 窄屏或其他容器:底部悬浮条「目录 · 当前小节 · 百分比」,点开后目录浮起 (767px 以下为底部抽屉),选中小节后收起。手机上页头下方另有 2px 阅读进度线。

两形态共用服务端生成的 toc_html(嵌套 <ul><li><a href="#id">),只保留一份 列表,scroll-spy 只需维护一处激活态。scroll-spy、当前小节名与阅读进度由 yggdrasil-core 的 __initTocSidebar 维护;锚点点击由 initAnchorClick 平滑滚动。

Structs§

PostTocProps
Props for the PostToc component.

Constants§

DEFAULT_NAV_ID 🔒
正式页面目录的默认 id;图鉴预览传入各自的局部 id。

Functions§

PostToc
文章目录(Table of Contents)组件。
focus_by_id 🔒