---
nav:
 title: 组件
 order: 2
group:
    title: 其他 
    order: 5 
title: NavLeafScroll
order: 4
toc: content
---
## NavLeafScroll 可滚动翻页菜单/列表

## 代码演示

### 基本使用

<code title="基础用法" hideactions='["CSB"]' src="../../src/NavLeafScroll/demos/basic.tsx"></code>

## API

| 参数      | 说明         | 类型         | 默认值 | 参考值|
|----------|-------------------|-------------|-------|------|
| type | 展示模式（默认纵向，横向） |String | 纵向'vertical' | 'horizontal', 'vertical'|
| align | 元素块不超出内容区无滚动时(不翻页)，默认对齐方式 |String | 'left/top' | 'left/top', 'center'|
| navList | 数据源 | Array<字段参考optionName> | - | |
| optionName | 数据源参数字段 | Object | { key: 'id', title: 'title', count: 'count'} | |
| baseItemHeight | 指定单元格高度(type='vertical')，用于计算有效展示数量 | Number | 40 | |
| baseItemWidth | 指定单元格宽度(type='horizontal')，用于计算有效展示数量 | Number | 40 | |
| onNavMouseEnter | 鼠标经过列表事件 | Function | - | |
| onNavMouseLeave | 鼠标离开列表事件 | Function | - | |
| onClick | 点击单元格事件 | Function(key,data) | - | |
| activeKey | 选中单元格 |String | - | |
| customLeafNode | 自定义节点结构 |ReactNode | - | |
| className | 列表区域样式类 |String | - | |
| width | 内容区宽度(type='vertical') |Number/string | - | |
| height | 内容区高度(type='horizontal') |Number/string | - | |
| forbidScroll | 禁止启动滚动监听，即滚动不会触发列表翻页 |Boolean | - | |
| emptyNode | 无数据时显示 |ReactNode | - | |
