# 属性

| 属性名称         | 类型                                        | 说明                                                         | 默认值        |
| ---------------- | ------------------------------------------- | ------------------------------------------------------------ | ------------- |
| width            | number                                      | 宽度 单位`px`                                                | 500           |
| height           | number                                      | 高度 单位`px`                                                | 400           |
| showFilterBar    | boolean                                     | 显示过滤行                                                   | false         |
| showHeader       | boolean                                     | 显示表头                                                     | true          |
| headerHeight     | number                                      | 表头高度                                                     | 35px          |
| columns          | TreeTableColumn[]                           | 列信息                                                       | []            |
| data             | TreeNode[]                                  | 数据源                           |               |[]
| fitColumns       | boolean                                     | 自动列宽                                                     | true          |
| singleSelect     | boolean                                     | 单选，否则为 false                                           | true          |
| showCheckbox     | boolean                                     | 启用多选后，是否显示复选框                                   | true          |
| idField          | string                                      | 标识字段                                                     |               |
| showIcon         | boolean                                     | 树节点是否显示图标                                           | false         |
| showBorder       | boolean                                     | 显示边线                                                     | true          |
| shoCheckAll      | boolean                                     | 表头中显示全选checkbox                                       | true          |
| striped          | boolean                                     | 启用斑马线效果                                               | false         |
| disabled         | boolean                                     | 禁用                                                         | false         |
| loadDataType     | 'all' \| 'async'                            | 数据加载方式 <br> - `all` 全部加载<br> - `async` 分层加载               | 'all'         |
| checkOnSelect    | boolean                                     | 当多选时，选中当前行并钩选                                   | false         |
| selectOnCheck    | boolean                                     | 当多选时，钩选并选中当前行                                   | false         |
| onlySelectSelf   | boolean                                     | 启用多选时，此属性为true 时，仅有当前行选中，否则会有多行被选中 | false         |
| resizableColumns | boolean                                     | 启用列宽调整                                                 | true          |
| fit              | boolean                                     | 设置为true时自适应父容的尺寸                                 | false         |
| cascadeCheck     | boolean                                     | 启用级联选中功能                                             | true          |
| cascadeDown      | boolean                                     | 向下级联选中                                                 | true          |
| cascadeUp        | boolean                                     | 向上级联选中                                                 | true          |
| keepSelect       | boolean                                     | 单击行选中后，在次点击不会被取消选中状态;                    | true          |
| virtualized      | boolean                                     | 虚拟加载                                                     | false         |
| leafIcon         | string                                      | 叶子节点图标 css class                                       | 'file'        |
| expandIcon       | string                                      | 节点展开图标                                                 | 'folder-open' |
| collapseIcon     | string                                      | 节点折叠图标                                                 | ‘folder’      |
| remoteSort       | boolean                                     | 启用远端排序                                                 | true          |
| sortName         | string                                      | 排序字段                                                     |               |
| sortOrder        | string                                      | 排序方式                                                     |               |
| multiSort        | boolean                                     | 允许多列排序                                                 | false         |
| rowStyler        | (treeNode: TreeNode, field?: string) => any | 自定义行样式                                                 |               |
| cellStyler       | (treeNode: TreeNode, field: string) => any  | 自定义单元格样式                                             |               |
|                  |                                             |                                                              |               |

# 事件

| 事件名称         | 参数                                                         | 说明               |
| ---------------- | ------------------------------------------------------------ | ------------------ |
| nodeSelected     | EventEmitter<TreeNode \| TreeNode[]>  当前选中的节点         | 节点选中后触发     |
| nodeUnSelect     | EventEmitter<TreeNode \| TreeNode[]> 当前选中的节点          | 节点取消选中后触发 |
| nodeChecked      | EventEmitter<NodeCheckedParam><br />{<br /> originalEvent: Event;<br />node: TreeNode;<br />} | 节点钩选后事件     |
| nodeUnChecked    | EventEmitter<NodeCheckedParam>                               | 节点取消钩选后事件 |
| checkAll         | 无                                                           | 全部钩选           |
| unCheckAll       | 无                                                           | 全部取消钩选       |
| expand           | EventEmitter<TreeNode>                                       | 展开指定节点后触发 |
| collapse         | EventEmitter<TreeNode>                                       | 折叠指定节点后触发 |
| expandAllNodes   |                                                              | 展开所有节点后触发 |
| collapseAllNodes | 无                                                           | 折叠所有节点后触发 |
| cellClick        | { <br />event: Event,   // 事件Event 对象<br />col: any,  // 字段信息<br /> node: any  // 节点信息<br /> } | 单元格点击事件     |
|                  |                                                              |                    |


# TreeNode 类型定义


```javascript
export interface TreeNode {
    id?: string;
    data: any;
    /** 叶子节点图标 */
    icon?: any;
    /** 节点展开图标 */
    expandedIcon?: any;
    /** 节点折叠图标 */
    collapsedIcon?: any;
    /** 子节点 */
    children?: TreeNode[];
    /** 是否为叶子节点 */
    leaf?: boolean;
    /** 是否展开 */
    expanded?: boolean;
    type?: string;
    /** 父节点 */
    parent?: TreeNode;
    /** 是否允许选中 */
    selectable?: boolean;
}
```