开发预览更新于 2026-05-10

Anchor 锚点导航

显式列出页面锚点的侧栏，滚动时高亮当前可见小节，点击平滑跳转。

基础用法

items 为锚点列表，每项 { href, label }；href 形如 #section-id，对应页面里 <h2 id="section-id">。可嵌套 children 一层。

这是概述部分的第 1 段示例文本。

这是概述部分的第 2 段示例文本。

这是概述部分的第 3 段示例文本。

这是概述部分的第 4 段示例文本。

这是基础用法部分的第 1 段示例文本。

这是基础用法部分的第 2 段示例文本。

这是基础用法部分的第 3 段示例文本。

这是基础用法部分的第 4 段示例文本。

这是 API 部分的第 1 段示例文本。

这是 API 部分的第 2 段示例文本。

这是 API 部分的第 3 段示例文本。

这是 API 部分的第 4 段示例文本。

<CfAnchor :items="items" :offset-top="0" />

<CfAnchor items={items} offsetTop={0} />

属性	类型	默认值	说明
`items`	`AnchorItem[]`	`—`	锚点列表
`offsetTop`	`number`	`0`	高亮判定与滚动跳转时的顶部偏移（像素）
`bounds`	`number`	`5`	元素距顶 ≤ `bounds + offsetTop` 时视为已进入；越小越严格
`target`	`string`	`—`	滚动容器选择器；省略时监听 `window`

事件：onChange(href) —— 当前高亮的锚点变化时触发。