---
title: "Ext.app.Portlet"
description: "xtype 为 portlet 的 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.app.Portlet

源码定义：`ext-all-debug.js:145396`。分类：基础组件与提示。

## 创建示例

```javascript
var component = Ext.create("Ext.app.Portlet", {
  xtype: "portlet",
  anchor: '100%',
  animCollapse: true,
  closable: true,
  cls: 'x-portlet',
  renderTo: Ext.getBody()
});
```

## 属性

| 属性 | 类型 | 默认值 | 说明 | 配置示例 |
| --- | --- | --- | --- | --- |
| `anchor` | `String` | `'100%'` | 配置组件的 `anchor` 选项。 | `anchor: '100%'` |
| `animCollapse` | `Boolean` | `true` | 控制是否启用 `animCollapse` 行为。 | `animCollapse: true` |
| `closable` | `Boolean` | `true` | 控制组件是否显示关闭操作。 | `closable: true` |
| `cls` | `String` | `'x-portlet'` | 附加到组件根元素的 CSS 类名。 | `cls: 'x-portlet'` |
| `collapsible` | `Boolean` | `true` | 控制面板是否允许展开和收起。 | `collapsible: true` |
| `draggable` | `Object` | `{` | 配置组件的 `draggable` 选项。 | `draggable: {` |
| `layout` | `String` | `'fit'` | 容器对子组件进行排布的布局配置。 | `layout: 'fit'` |
| `resizable` | `Boolean` | `true` | 控制是否启用 `resizable` 行为。 | `resizable: true` |
| `resizeHandles` | `String` | `'s'` | 配置组件的 `resizeHandles` 选项。 | `resizeHandles: 's'` |
| `tools` | `Array` | `[{` | 配置组件的 `tools` 选项。 | `tools: [{` |

## 方法

| 方法 | 参数 | 说明 | 调用示例 |
| --- | --- | --- | --- |
| `doClose` | `` | 执行 `close` 操作。 执行时会派发 `close` 事件、更新 `closing` 状态。源码涉及 `fireEvent()`。 | `component.doClose()` |

## 事件

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

Source: https://ag.879818327.xyz/ext/basic/app-portlet/index.mdx