我正在使用 Ext.dataview.DataView View 。我想向此数据 View 添加一个组件,它看起来像 Ext.dataview.List 中的 grouper headers 以保持设计一致。我只想在头上应用一次这个组件(所以基本上只有一组)。将 View 更改为列表不是一种选择,因为它的复杂性会带来更多新问题。
我已经尝试过添加一个面板并应用 x-list-header 类,但这没有成功。使组件看起来像列表的组标题的最简单方法是什么?
Ext.define( 'app.view.myDataView', {
extend: 'Ext.dataview.DataView',
xtype: 'mydataview',
requires: [
'app.view.myItem',
'Ext.dataview.List'
],
config: {
title: "myDataView",
cls: 'myDataView',
defaultType: 'myitem',
grouped: true,
store: 'myStore',
useComponents: true,
disableSelection: true,
deferEmptyText: false,
itemCls: 'myItem',
items: [
{
xtype: 'toolbar',
layout: 'vbox',
docked: 'top',
cls: 'myToolbar',
items: [
{
// some toolbar items
}
]
},
{
xtype: 'component',
cls: 'x-list-header',
html: 'this is a test'
}
/*{
xtype:'panel',
scrollDock:'top',
docked:'top',
tpl: new Ext.XTemplate ('<div class="x-list-header-wrap x-list-header">this is a test</div>'),
height:60
},*/
]
}
});
提前致谢!
最佳答案
方法没问题。但是你需要以下内容
<div class="x-container x-list ..." id="ext-container-13">
<div class="x-inner" id="ext-element-95">
<div class="x-innerhtml x-list-header" id="ext-element-125">
your content goes here
</div>
</div>
</div>
使用:
{
xtype: 'container',
cls: 'x-list',
styleHtmlContent: true,
styleHtmlCls: 'x-list-header',
}
关于javascript - Sencha 触摸 : Component on DataView that looks like List Group Header,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33253893/