Affix 固钉
将元素固定在特定可见区域。
基础用法
固钉默认固定在页面顶部。
可通过 offset 属性设置距离顶部的偏移量,默认值为 0。
指定容器
通过 target 属性指定容器后,固钉会始终相对于该容器定位;超出范围时会被隐藏。
指定容器时请注意避免让容器本身出现滚动条。
固定位置
固钉组件支持 top 与 bottom 两种固定位置。
可通过 position 属性设置固定位置,默认值为 top。
固钉 API
固钉 属性
| 名称 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| offset | 偏移距离 | number | 0 |
| position | 固钉位置 | enum | top |
| target | 目标容器(CSS 选择器) | string | — |
| z-index | 固钉的 z-index | number | 100 |
| teleported | 是否将固钉元素传送;为 true 时传送到 append-to 指定的位置 | boolean | false |
| append-to | 固钉元素挂载到的目标节点 | CSSSelector / HTMLElement | body |
固钉 事件
| 事件名 | 说明 | 类型 |
|---|---|---|
| change | 固定状态变化时触发 | Function |
| scroll | 滚动时触发 | Function |
固钉 插槽
| 名称 | 说明 |
|---|---|
| default | 自定义默认内容 |
固钉 暴露
| 名称 | 说明 | 类型 |
|---|---|---|
| update | 手动更新固钉状态 | Function |
| updateRoot | 更新根节点布局信息 | Function |