彩票走势图

logo DevExtreme 中文文档

Accordion

立即下载DevExtreme

Accordion UI组件包含几个面板，一个显示在另一个之下。最终用户可以折叠或展开这些面板，这使得该UI组件对于在有限的空间中显示信息非常有用。

包含：dx.web.js, dx.all.js
从“devextreme/ui/ Accordion”导入Accordion 

// You can create the Accordion widget using the following code.
// Read more at //js.devexpress.com/Documentation/Guide/Widgets/Common/Advanced/3rd-Party_Frameworks_Integration_API/#Create_and_Configure_a_Widget.

new DevExpress.ui.dxAccordion(container, {
"dataSource": [
{
"title": "Personal Data",
"text": "Name: John Smith, Birth Year: 1986"
},
{
"title": "Contacts",
"text": "Phone: (555)555-5555, Email: John.Smith@example.com"
}
]
});

点击复制 

import Accordion from "devextreme/ui/accordion";

new Accordion(container, {
accessKey:undefined,
activeStateEnabled:false,
animationDuration:300,
collapsible:false,
dataSource:Edit,
deferRendering:true,
disabled:false,
elementAttr:{},
focusStateEnabled:true,
height:undefined,
hint:undefined,
hoverStateEnabled:true,
itemComponent:null,
itemHoldTimeout:750,
itemRender:null,
items:Edit,
itemTemplate:"item",
itemTitleComponent:null,
itemTitleRender:null,
itemTitleTemplate:"title",
keyExpr:null,
multiple:false,
noDataText:"No data to display",
onContentReady:null,
onDisposing:null,
onInitialized:null,
onItemClick:null,
onItemContextMenu:null,
onItemHold:null,
onItemRendered:null,
onItemTitleClick:null,
onOptionChanged:null,
onSelectionChanged:null,
repaintChangesOnly:false,
rtlEnabled:false,
selectedIndex:0,
selectedItem:null,
selectedItemKeys:null,
selectedItems:null,
tabIndex:0,
visible:true,
width:undefined
});

点击复制

简介
联系方式

配置

定义Accordion UI组件配置属性的对象。

名称 描述
accessKey 指定将焦点设置在UI组件上的快捷键。
activeStateEnabled 指定UI组件是否因用户交互而改变其视觉状态。
animationDuration 一个数字，指定在面板展开或折叠的动画上花费的时间(以毫秒为单位)。
collapsible 指定是否可以折叠所有项，或者是否必须始终展开至少一个项。
dataSource 将UI组件绑定到数据。
deferRendering 指定在显示面板时是否呈现面板的内容，如果为false，则立即呈现内容。
disabled 指定UI组件是否响应用户交互。
elementAttr 指定要附加到UI组件的容器元素的全局属性。
focusStateEnabled 指定UI组件是否可以集中使用键盘导航。
height 指定UI组件的高度。
hint 指定当用户在UI组件上暂停时出现的提示文本。
hoverStateEnabled 指定当用户在UI组件上暂停时，UI组件是否改变其状态。
itemComponent 在React中指定的itemTemplate属性的别名，接受自定义组件。
itemHoldTimeout 触发onItemHold事件之前的时间周期(以毫秒为单位)。
itemRender 在React中指定的itemTemplate属性的别名，接受呈现函数。
items UI组件显示的项数组。
itemTemplate 为项指定自定义模板。
itemTitleComponent 在React中指定的itemTitleTemplate属性的别名，接受自定义组件。
itemTitleRender 在React中指定的itemTitleTemplate属性的别名，接受呈现函数。
itemTitleTemplate 指定项目标题的自定义模板。
keyExpr 指定key属性，该属性提供用于访问数据项的键值，每个键值必须是唯一的。
multiple 指定UI组件是一次可以展开多个项还是只能展开单个项。
noDataText 指定在项集合为空时UI组件显示的文本或HTML标记。
onContentReady 一个在UI组件被渲染和每次重新绘制组件时执行的函数。
onDisposing 在UI组件被处理之前执行的函数。
onInitialized JavaScript框架中用于保存UI组件实例的函数。
onItemClick 当单击或轻击集合项时执行的函数。
onItemContextMenu 当右键单击或按下集合项时执行的函数。
onItemHold 当一个集合项被持有一段指定时间后执行的函数。
onItemRendered 渲染集合项后执行的函数。
onItemTitleClick 当单击或轻击accordion项目的标题时执行的函数。
onOptionChanged UI 组件属性更改后执行的函数。
onSelectionChanged 选择集合项或取消选择时执行的函数。
repaintChangesOnly 指定是否仅重新绘制数据发生更改的那些元素。
rtlEnabled 将 UI 组件切换为从右到左的表示形式。
selectedIndex 当前展开项目的索引号。
selectedItem 扩展的项目对象。
selectedItemKeys 指定当前扩展的项目键的数组。
selectedItems 当前扩展的项目对象的数组。
tabIndex 指定使用 Tab 键导航时的元素编号。
visible 指定 UI 组件是否可见。
width 指定 UI 组件的宽度。

方法

本节描述用于操作Accordion UI组件的成员。

名称 描述
beginUpdate() 推迟可能对性能产生负面影响的呈现，直到调用endUpdate()方法。
collapseItem(index) 折叠具有特定索引的项目。
defaultOptions(rule) 指定该组件的与设备相关的默认配置属性。
dispose() 释放分配给Accordion实例的所有资源。
element() 获取根UI组件元素。
endUpdate() 在调用beginUpdate()方法后刷新UI组件。
expandItem(index) 扩展具有特定索引的项目。
focus() 将焦点设置在UI组件上。
getDataSource() 获取数据源实例。
getInstance(element) 获取使用DOM节点找到的UI组件的实例。
getInstance(element) 获取UI组件的实例，使用它来访问UI组件的其他方法。
off(eventName) 将所有事件处理程序与单个事件分离。
off(eventName, eventHandler) 从单个事件中分离特定的事件处理程序。
on(eventName, eventHandler) 订阅事件。
on(events) 订阅事件。
option() 获取所有UI组件属性。
option(optionName) 获取单个属性的值。
option(optionName, optionValue) 更新单个属性的值。
option(options) 更新多个属性的值。
registerKeyHandler(key, handler) 注册当用户按下特定键时要执行的处理程序。
repaint() 重新绘制 UI 组件而不重新加载数据，调用它来更新 UI 组件的标记。
resetOption(optionName) 将属性重置为其默认值。
updateDimensions() 更新 UI 组件内容的尺寸。

事件

本节描述由该UI组件触发的事件。

名称 描述
contentReady 当 UI 组件的内容准备就绪时引发。
disposing 在UI组件被销毁之前引发。
initialized 仅在 UI 组件初始化后引发一次。
itemClick 单击或点击集合项时引发。
itemContextMenu 右键单击或按下集合项时引发。
itemHold 当收集项被持有一段指定时间时引发。
itemRendered 呈现集合项后引发。
itemTitleClick 当单击或点击accordion项目的标题时引发。
optionChanged UI 组件属性更改后引发。
selectionChanged 当集合项展开或折叠时引发。
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP