使用Sencha Touch应用程序覆盖列表项

2022-04-04 00:00:00 javascript sencha-touch

我正在开发一个带有列表的Sencha Touch应用程序,特别是在一个列表中,我们(例如)有400个不同的项目,有必要包括参数infinite: true以提高视图的性能。

但我看到一个奇怪的行为,这些项目与下一个项目重叠。

我的代码是:

xtype        : 'list',
cls          : 'mweb-list',
useComponents: true,
maxItemCache: 30,
useHeaders   : false,
infinite   : true,

当我包含infinite参数时会发生此行为..

组件CLS没有CSS规则,您可以在此处查看扩展组件:

Ext.define('xx.components.list.BaseListComponent', {
  extend: 'Ext.dataview.List',
  xtype : 'mwebBaseListComponent',

  config: {
    cls          : 'mweb-list',
    useComponents: true,
    emptyText    : '',
    loadingText  : '',
    useHeaders   : false
  }
});

有线索吗??

提前谢谢您。


解决方案

您可能希望使用标志VariableHeights:True。

xtype        : 'list',
cls          : 'mweb-list',
useComponents: true,
maxItemCache: 30,
useHeaders   : false,
infinite   : true,
variableHeights: true,
除此之外,您的mweb-list可能设置为普通列表,但不遵循无限列表的结构。 如果VariableHeights没有帮助,请发布您的CSS代码。

css:

.mweb-list {
    --> post whatever is in here
}

相关文章