1.0.5 • Published 6 years ago
@beisen-phoenix/anchor v1.0.5
锚点
@beisen-phoenix/anchor
概述
用于模块较多的页面,可帮助用户更快速的定位至想要查看的模块。
导出说明
默认导出为非受控组件,鼠标移入移出时自动展开收起。同时导出受控组件--PureAnchor
API
非受控组件的属性(默认)
| 参数 | 说明 | 类型 | 默认值 | 是否必传 | |
|---|---|---|---|---|---|
| width | 展开后的宽度 | string | "118px" | 否 | |
| maxHeight | 最大高度 | string | "330px" | 否 | |
| data | 每个Link组件的属性 | Array\<IData> | - | 是 | |
| selectedId | 当前选中Link的id | string | number | - | 是 | |
| onSelect | 选中Link的回调 | (selectedId: string | number, e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void | - | 是 |
受控组件的属性
| 参数 | 说明 | 类型 | 默认值 | 是否必传 | |
|---|---|---|---|---|---|
| width | 展开后的宽度 | string | "118px" | 否 | |
| maxHeight | 最大高度 | string | "330px" | 否 | |
| data | 每个Link组件的属性 | Array\<IData> | - | 是 | |
| selectedId | 当前选中Link的id | string | number | - | 是 | |
| onSelect | 选中Link的回调 | (selectedId: string | number, e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void | - | 是 |
| expanded | 是否是展开状态,默认收起,hover时展开 | boolean | false | 是 | |
| onMouseEnter | 鼠标移入事件的回调 | (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void | - | 是 | |
| onMouseLeave | 鼠标移出事件的回调 | (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void | - | 是 |
IData
| 参数 | 说明 | 类型 | 默认值 | 是否必传 |
|---|---|---|---|---|
| id | 标识 | string | number | - | 是 |
| title | 文字内容 | string | - | 是 |
| href | 锚点链接 | string | - | 否 |
| target | 指定在何处显示链接的资源 | string | - | 否 |