Ext.view.View | WebBuilder 文档

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

创建示例

var component = Ext.create("Ext.view.View", {
  xtype: "dataview",
  autoScroll: true,
  barExportButtons: true,
  deferHighlight: Ext.isIE7m ? 100 : 0,
  inputTagRe: /^textarea$|^input$/i,
  renderTo: Ext.getBody()
});

属性

属性	类型	默认值	说明	配置示例
`autoScroll`	`Boolean`	`true`	控制内容溢出时是否自动显示滚动条。	`autoScroll: true`
`barExportButtons`	`Boolean`	`true`	控制是否启用 `barExportButtons` 行为。	`barExportButtons: true`
`deferHighlight`	`Mixed`	`Ext.isIE7m ? 100 : 0`	配置组件的 `deferHighlight` 选项。	`deferHighlight: Ext.isIE7m ? 100 : 0`
`inputTagRe`	`Mixed`	`/^textarea$\|^input$/i`	配置组件的 `inputTagRe` 选项。	`inputTagRe: /^textarea$\|^input$/i`
`mouseOverOutBuffer`	`Number`	`20`	配置组件的 `mouseOverOutBuffer` 选项。	`mouseOverOutBuffer: 20`
`onBeforeContainerClick`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerClick` 回调函数。	`onBeforeContainerClick: Ext.emptyFn`
`onBeforeContainerContextMenu`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerContextMenu` 回调函数。	`onBeforeContainerContextMenu: Ext.emptyFn`
`onBeforeContainerDblClick`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerDblClick` 回调函数。	`onBeforeContainerDblClick: Ext.emptyFn`
`onBeforeContainerKeyDown`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerKeyDown` 回调函数。	`onBeforeContainerKeyDown: Ext.emptyFn`
`onBeforeContainerMouseDown`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerMouseDown` 回调函数。	`onBeforeContainerMouseDown: Ext.emptyFn`
`onBeforeContainerMouseOut`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerMouseOut` 回调函数。	`onBeforeContainerMouseOut: Ext.emptyFn`
`onBeforeContainerMouseOver`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerMouseOver` 回调函数。	`onBeforeContainerMouseOver: Ext.emptyFn`
`onBeforeContainerMouseUp`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeContainerMouseUp` 回调函数。	`onBeforeContainerMouseUp: Ext.emptyFn`
`onBeforeItemClick`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemClick` 回调函数。	`onBeforeItemClick: Ext.emptyFn`
`onBeforeItemContextMenu`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemContextMenu` 回调函数。	`onBeforeItemContextMenu: Ext.emptyFn`
`onBeforeItemDblClick`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemDblClick` 回调函数。	`onBeforeItemDblClick: Ext.emptyFn`
`onBeforeItemFocus`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemFocus` 回调函数。	`onBeforeItemFocus: Ext.emptyFn`
`onBeforeItemKeyDown`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemKeyDown` 回调函数。	`onBeforeItemKeyDown: Ext.emptyFn`
`onBeforeItemMouseDown`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemMouseDown` 回调函数。	`onBeforeItemMouseDown: Ext.emptyFn`
`onBeforeItemMouseEnter`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemMouseEnter` 回调函数。	`onBeforeItemMouseEnter: Ext.emptyFn`
`onBeforeItemMouseLeave`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemMouseLeave` 回调函数。	`onBeforeItemMouseLeave: Ext.emptyFn`
`onBeforeItemMouseUp`	`Mixed`	`Ext.emptyFn`	配置 `onBeforeItemMouseUp` 回调函数。	`onBeforeItemMouseUp: Ext.emptyFn`
`onContainerClick`	`Mixed`	`Ext.emptyFn`	配置 `onContainerClick` 回调函数。	`onContainerClick: Ext.emptyFn`
`onContainerContextMenu`	`Mixed`	`Ext.emptyFn`	配置 `onContainerContextMenu` 回调函数。	`onContainerContextMenu: Ext.emptyFn`
`onContainerDblClick`	`Mixed`	`Ext.emptyFn`	配置 `onContainerDblClick` 回调函数。	`onContainerDblClick: Ext.emptyFn`
`onContainerKeyDown`	`Mixed`	`Ext.emptyFn`	配置 `onContainerKeyDown` 回调函数。	`onContainerKeyDown: Ext.emptyFn`
`onContainerMouseDown`	`Mixed`	`Ext.emptyFn`	配置 `onContainerMouseDown` 回调函数。	`onContainerMouseDown: Ext.emptyFn`
`onContainerMouseOut`	`Mixed`	`Ext.emptyFn`	配置 `onContainerMouseOut` 回调函数。	`onContainerMouseOut: Ext.emptyFn`
`onContainerMouseOver`	`Mixed`	`Ext.emptyFn`	配置 `onContainerMouseOver` 回调函数。	`onContainerMouseOver: Ext.emptyFn`
`onContainerMouseUp`	`Mixed`	`Ext.emptyFn`	配置 `onContainerMouseUp` 回调函数。	`onContainerMouseUp: Ext.emptyFn`
`onItemClick`	`Mixed`	`Ext.emptyFn`	配置 `onItemClick` 回调函数。	`onItemClick: Ext.emptyFn`
`onItemContextMenu`	`Mixed`	`Ext.emptyFn`	配置 `onItemContextMenu` 回调函数。	`onItemContextMenu: Ext.emptyFn`
`onItemDblClick`	`Mixed`	`Ext.emptyFn`	配置 `onItemDblClick` 回调函数。	`onItemDblClick: Ext.emptyFn`
`onItemFocus`	`Mixed`	`Ext.emptyFn`	配置 `onItemFocus` 回调函数。	`onItemFocus: Ext.emptyFn`
`onItemKeyDown`	`Mixed`	`Ext.emptyFn`	配置 `onItemKeyDown` 回调函数。	`onItemKeyDown: Ext.emptyFn`
`onItemMouseDown`	`Mixed`	`Ext.emptyFn`	配置 `onItemMouseDown` 回调函数。	`onItemMouseDown: Ext.emptyFn`
`onItemMouseUp`	`Mixed`	`Ext.emptyFn`	配置 `onItemMouseUp` 回调函数。	`onItemMouseUp: Ext.emptyFn`
`processContainerEvent`	`Mixed`	`Ext.emptyFn`	配置组件的 `processContainerEvent` 选项。	`processContainerEvent: Ext.emptyFn`
`processItemEvent`	`Mixed`	`Ext.emptyFn`	配置组件的 `processItemEvent` 选项。	`processItemEvent: Ext.emptyFn`
`processSpecialEvent`	`Mixed`	`Ext.emptyFn`	配置组件的 `processSpecialEvent` 选项。	`processSpecialEvent: Ext.emptyFn`
`tagClosable`	`Boolean`	`true`	控制是否启用 `tagClosable` 行为。	`tagClosable: true`
`tplDisplay`	`Object/null`	`null`	配置组件的 `tplDisplay` 选项。	`tplDisplay: null`
`tplIcon`	`Object/null`	`null`	配置组件的 `tplIcon` 选项。	`tplIcon: null`
`tplTip`	`Object/null`	`null`	配置组件的 `tplTip` 选项。	`tplTip: null`
`viewType`	`Object/null`	`null`	配置组件的 `viewType` 选项。	`viewType: null`

方法

方法	参数	说明	调用示例
`setValue`	`value`	设置 `value`。	`component.setValue(...)`
`getValue`	``	读取并返回 `value`。源码涉及 `getSelection()`。	`component.getValue()`
`getNodeContainer`	``	读取并返回 `nodeContainer`。执行时会保留父类默认行为。源码涉及 `callParent()`。	`component.getNodeContainer()`
`initComponent`	``	初始化组件及其子项。执行时会保留父类默认行为、更新 `viewType`、`cls` 状态。源码涉及 `mon()`、`refresh()`、`callParent()`。	`component.initComponent()`
`addCmpEvents`	``	添加 `cmpEvents`。源码涉及 `addEvents()`。	`component.addCmpEvents()`
`getFocusEl`	``	读取并返回 `focusEl`。源码涉及 `getTargetEl()`。	`component.getFocusEl()`
`loadPageBarItems`	``	加载 `pageBarItems`。	`component.loadPageBarItems()`
`afterRender`	``	生成 `after` 的渲染结果。执行时会保留父类默认行为、更新 `pagingBarComp` 状态。源码涉及 `callParent()`、`mon()`、`getTargetEl()`、`setLocalXY()`。	`component.afterRender()`
`onMouseOver`	`e`	处理 `mouseOver` 回调。源码涉及 `handleMouseOver()`。	`component.onMouseOver(...)`
`getSelection`	``	读取并返回 `selection`。	`component.getSelection()`
`setSelection`	`records, keepExisting, suppressEvent`	设置 `selection`。	`component.setSelection(...)`
`onMouseOut`	`e`	处理 `mouseOut` 回调。源码涉及 `getTargetSelector()`、`handleMouseOut()`。	`component.onMouseOut(...)`
`getTargetSelector`	``	读取并返回 `targetSelector`。	`component.getTargetSelector()`
`handleMouseOver`	`e`	处理 `mouseOver`。执行时会更新 `mouseOverItem` 状态。源码涉及 `getTargetSelector()`、`handleEvent()`。	`component.handleMouseOver(...)`
`handleMouseOut`	`e, item`	处理 `mouseOut`。源码涉及 `handleEvent()`。	`component.handleMouseOut(...)`
`handleEvent`	`e`	处理 `event`。源码涉及 `processUIEvent()`、`processSpecialEvent()`。	`component.handleEvent(...)`
`processUIEvent`	`e`	处理 `uIEvent`。执行时会派发 `beforeitem`、`item`、`beforecontainer`、`container` 事件。源码涉及 `getTargetSelector()`、`getTargetEl()`、`statics()`、`getSelectionModel()`。	`component.processUIEvent(...)`
`onItemMouseEnter`	`record, item, index, e`	处理 `itemMouseEnter` 回调。源码涉及 `highlightItem()`。	`component.onItemMouseEnter(...)`
`onItemMouseLeave`	`record, item, index, e`	处理 `itemMouseLeave` 回调。源码涉及 `clearHighlight()`。	`component.onItemMouseLeave(...)`
`setHighlightedItem`	`item`	设置 `highlightedItem`。执行时会派发 `unhighlightitem`、`highlightitem` 事件、更新 `highlightedItem` 状态。源码涉及 `fireEvent()`。	`component.setHighlightedItem(...)`
`highlightItem`	`item`	处理 `highlightItem` 操作。源码涉及 `setHighlightedItem()`。	`component.highlightItem(...)`
`clearHighlight`	``	清空 `highlight`。源码涉及 `setHighlightedItem()`。	`component.clearHighlight()`
`onUpdate`	`store, record`	处理 `update` 回调。执行时会保留父类默认行为。源码涉及 `getNode()`、`callParent()`、`highlightItem()`。	`component.onUpdate(...)`
`refresh`	``	刷新组件。执行时会保留父类默认行为。源码涉及 `clearHighlight()`、`callParent()`。	`component.refresh()`
`focusNode`	`rec`	将焦点移动到 `node`。源码涉及 `getNode()`、`scrollBy()`。	`component.focusNode(...)`
`bindStore`	`store, initial, propertyName`	绑定 `store`。执行时会保留父类默认行为。源码涉及 `bindStoreListeners()`、`callParent()`、`mon()`。	`component.bindStore(...)`

事件

事件	说明	监听示例
`beforecontainerclick`	用户点击视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainerclick: function () {} }`
`beforecontainercontextmenu`	用户打开上下文菜单视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainercontextmenu: function () {} }`
`beforecontainerdblclick`	用户双击视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainerdblclick: function () {} }`
`beforecontainerkeydown`	用户按下按键视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainerkeydown: function () {} }`
`beforecontainermousedown`	用户按下鼠标按钮视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainermousedown: function () {} }`
`beforecontainermouseout`	用户移出视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainermouseout: function () {} }`
`beforecontainermouseover`	用户悬停视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainermouseover: function () {} }`
`beforecontainermouseup`	用户松开鼠标按钮视图容器区域之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforecontainermouseup: function () {} }`
`beforedeselect`	执行 `deselect` 对应的默认操作之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforedeselect: function () {} }`
`beforeitemclick`	用户点击数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemclick: function () {} }`
`beforeitemcontextmenu`	用户打开上下文菜单数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemcontextmenu: function () {} }`
`beforeitemdblclick`	用户双击数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemdblclick: function () {} }`
`beforeitemkeydown`	用户按下按键数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemkeydown: function () {} }`
`beforeitemmousedown`	用户按下鼠标按钮数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemmousedown: function () {} }`
`beforeitemmouseenter`	用户移入数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemmouseenter: function () {} }`
`beforeitemmouseleave`	用户移出数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemmouseleave: function () {} }`
`beforeitemmouseup`	用户松开鼠标按钮数据项之前触发；监听器返回 `false` 可取消默认处理。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeitemmouseup: function () {} }`
`beforeselect`	选中值或记录之前触发，可用于取消选择。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { beforeselect: function () {} }`
`containerclick`	用户点击视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containerclick: function () {} }`
`containercontextmenu`	用户打开上下文菜单视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containercontextmenu: function () {} }`
`containerdblclick`	用户双击视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containerdblclick: function () {} }`
`containerkeydown`	用户按下按键视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containerkeydown: function () {} }`
`containermousedown`	用户按下鼠标按钮视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containermousedown: function () {} }`
`containermouseout`	用户移出视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containermouseout: function () {} }`
`containermouseover`	用户悬停视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containermouseover: function () {} }`
`containermouseup`	用户松开鼠标按钮视图容器区域时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { containermouseup: function () {} }`
`deselect`	记录或值被取消选中时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { deselect: function () {} }`
`focuschange`	当前焦点项变化后触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { focuschange: function () {} }`
`highlightitem`	数据项被高亮后触发。源码在 `setHighlightedItem()` 中通过 `fireEvent()` 触发。	`listeners: { highlightitem: function () {} }`
`itemclick`	用户点击子项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemclick: function () {} }`
`itemcontextmenu`	用户打开上下文菜单数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemcontextmenu: function () {} }`
`itemdblclick`	用户双击子项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemdblclick: function () {} }`
`itemkeydown`	用户按下按键数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemkeydown: function () {} }`
`itemmousedown`	用户按下鼠标按钮数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemmousedown: function () {} }`
`itemmouseenter`	用户移入数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemmouseenter: function () {} }`
`itemmouseleave`	用户移出数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemmouseleave: function () {} }`
`itemmouseup`	用户松开鼠标按钮数据项时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { itemmouseup: function () {} }`
`select`	用户选中值或记录时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { select: function () {} }`
`selectionchange`	选中记录集合发生变化时触发。源码只在事件声明处列出该事件；实际触发由继承的基类或关联对象负责。	`listeners: { selectionchange: function () {} }`
`unhighlightitem`	数据项取消高亮后触发。源码在 `setHighlightedItem()` 中通过 `fireEvent()` 触发。	`listeners: { unhighlightitem: function () {} }`