锚点 Anchor
使用 affix 组件可以让锚点固定在页面之内。
锚点的基础用法
锚点滚动偏移量
Section titled “锚点滚动偏移量”可以设置 boundary 来定制锚点滚动偏移量。
是否改变hash
Section titled “是否改变hash”可以设置点击锚点而不改变浏览器历史。
设置 line-less 时,可以使用无左侧轴线的锚点样式。
<anchor> Props
Section titled “<anchor> Props”| 参数名 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| boundary | 滚动边界值,设置该值为数字后,将会在距离滚动容器 boundary 距离时停止滚动。 | 'start' | 'end' | 'center' | 'nearest' | number | 'start' |
| line-less | 是否显示左侧轴线 | boolean | false |
| scroll-container | 滚动容器 | string | HTMLElement | Window | - |
| change-hash | 是否改变hash。设置为 false 时点击锚点不会改变页面的 hash | boolean | true |
| smooth | 是否使用平滑滚动 | boolean | true |
<anchor> Events
Section titled “<anchor> Events”| 事件名 | 描述 | 参数 |
|---|---|---|
| select | 用户点击链接时触发 | hash: string | undefinedpreHash: string |
| change | 链接发生改变时触发 | hash: string |
<anchor-link> Props
Section titled “<anchor-link> Props”| 参数名 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| title | 锚点链接的文本内容 | string | - |
| href | 锚点链接的地址 | string | - |