---
title: "Ext.tree.Column"
description: "xtype 为 treecolumn 的 Ext JS 原生组件参考。"
---

> Documentation Index
> Fetch the complete documentation index at: https://ag.879818327.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# Ext.tree.Column

源码定义：`ext-all-debug.js:141857`。分类：数据视图、表格与树。

## 创建示例

```javascript
var component = Ext.create("Ext.tree.Column", {
  xtype: "treecolumn",
  autoLock: true,
  cellTpl: [,
  checkboxCls: Ext.baseCSSPrefix + 'tree-checkbox',
  draggable: false,
  renderTo: Ext.getBody()
});
```

## 属性

| 属性 | 类型 | 默认值 | 说明 | 配置示例 |
| --- | --- | --- | --- | --- |
| `autoLock` | `Boolean` | `true` | 控制是否启用 `autoLock` 行为。 | `autoLock: true` |
| `cellTpl` | `Array` | `[` | 配置生成组件内容的 `cellTpl` 模板。 | `cellTpl: [` |
| `checkboxCls` | `Mixed` | `Ext.baseCSSPrefix + 'tree-checkbox'` | 配置 `checkboxCls` 对应的 CSS 类名。 | `checkboxCls: Ext.baseCSSPrefix + 'tree-checkbox'` |
| `draggable` | `Boolean` | `false` | 控制是否启用 `draggable` 行为。 | `draggable: false` |
| `elbowCls` | `Mixed` | `Ext.baseCSSPrefix + 'tree-elbow'` | 配置 `elbowCls` 对应的 CSS 类名。 | `elbowCls: Ext.baseCSSPrefix + 'tree-elbow'` |
| `expanderCls` | `Mixed` | `Ext.baseCSSPrefix + 'tree-expander'` | 配置 `expanderCls` 对应的 CSS 类名。 | `expanderCls: Ext.baseCSSPrefix + 'tree-expander'` |
| `hideable` | `Boolean` | `false` | 控制是否启用 `hideable` 行为。 | `hideable: false` |
| `iconCls` | `Mixed` | `Ext.baseCSSPrefix + 'tree-icon'` | 组件图标使用的 CSS 类名。 | `iconCls: Ext.baseCSSPrefix + 'tree-icon'` |
| `innerCls` | `Mixed` | `Ext.baseCSSPrefix + 'grid-cell-inner-treecolumn'` | 配置 `innerCls` 对应的 CSS 类名。 | `innerCls: Ext.baseCSSPrefix + 'grid-cell-inner-treecolumn'` |
| `isTreeColumn` | `Boolean` | `true` | 控制是否启用 `isTreeColumn` 行为。 | `isTreeColumn: true` |
| `lockable` | `Boolean` | `false` | 控制是否启用 `lockable` 行为。 | `lockable: false` |
| `tdCls` | `Mixed` | `Ext.baseCSSPrefix + 'grid-cell-treecolumn'` | 配置 `tdCls` 对应的 CSS 类名。 | `tdCls: Ext.baseCSSPrefix + 'grid-cell-treecolumn'` |
| `textCls` | `Mixed` | `Ext.baseCSSPrefix + 'tree-node-text'` | 配置 `textCls` 对应的 CSS 类名。 | `textCls: Ext.baseCSSPrefix + 'tree-node-text'` |

## 方法

| 方法 | 参数 | 说明 | 调用示例 |
| --- | --- | --- | --- |
| `initComponent` | `` | 初始化组件及其子项。 执行时会保留父类默认行为、更新 `origRenderer`、`origScope` 状态。源码涉及 `callParent()`。 | `component.initComponent()` |
| `treeRenderer` | `value, metaData, record, rowIdx, colIdx, store, view` | 生成 `tree` 的渲染结果。源码涉及 `initTemplateRendererData()`、`getTpl()`。 | `component.treeRenderer(...)` |
| `initTemplateRendererData` | `value, metaData, record, rowIdx, colIdx, store, view` | 初始化 `templateRendererData`。源码涉及 `getChildCls()`。 | `component.initTemplateRendererData(...)` |

## 事件

源码中未找到该组件自身注册的事件；可监听继承事件。

Source: https://ag.879818327.xyz/ext/data/tree-column/index.mdx