---
title: Anchor - 锚点
path: /anchor
nav:
  order: 1
  title: 桌面组件
  path: /design
group:
  order: 10
  title: 其他
  path: /others
---

页面内的超级链接，用于跳转到页面内指定位置

## 基础锚点

锚点间不存在层级关系。适用于锚点间为同级关系时，属于页面结构简单的场景。

<code src="./demos/base.tsx" />

## 多级锚点

锚点内含有层级关系。适用锚点内含有父子级关系时，属于页面结构复杂的场景。

<code src="./demos/multi.tsx" />

## 无轴线锚点

提供无轴线样式，适用于不同的页面

<code src="./demos/noLine.tsx" />

## API

### Anchor Props

| 成员             | 说明                                                                                | 类型                                | 默认值       | 版本         |
| ---------------- | ----------------------------------------------------------------------------------- | ----------------------------------- | ------------ | ------------ |
| affix            | 固定模式                                                                            | boolean                             | true         |              |
| bounds           | 锚点区域边界                                                                        | number                              | 5            |              |
| getContainer     | 指定滚动的容器                                                                      | () => HTMLElement                   | () => window |              |
| getCurrentAnchor | 自定义高亮的锚点                                                                    | (activeLink: string) => string      | -            |              |
| offsetTop        | 距离窗口顶部达到指定偏移量后触发                                                    | number                              |              |              |
| showInkInFixed   | `affix={false}` 时是否显示小圆点                                                    | boolean                             | false        |              |
| targetOffset     | 锚点滚动偏移量，默认与 offsetTop 相同，[例子](#components-anchor-demo-targetOffset) | number                              | -            |              |
| onChange         | 监听锚点链接改变                                                                    | (currentActiveLink: string) => void | -            |              |
| onClick          | `click` 事件的 handler                                                              | function(e: Event, link: Object)    | -            |              |
| hideLine         | 轴线显示                                                                            | boolean                             | false        | 自定义的参数 |

### Link Props

| 成员   | 说明                             | 类型      | 默认值 | 版本 |
| ------ | -------------------------------- | --------- | ------ | ---- |
| href   | 锚点链接                         | string    | -      |      |
| target | 该属性指定在何处显示链接的资源。 | string    | -      |      |
| title  | 文字内容                         | ReactNode | -      |      |