如何在ExtJS 6中将项目列表显示为大小正确的弹出窗口
我有一个错误列表(列表中的1到20个)。我想创建一个显示列表的弹出窗口,无论用户使用何种字体或浏览器,该窗口的大小都能很好地容纳列表。我在sencha的小提琴中做了一个例子,展示了我的问题和我的非最优解决方案。请建议如何改进(或使用sencha中的其他机制来获得我想要的)如何在ExtJS 6中将项目列表显示为大小正确的弹出窗口,extjs,Extjs,我有一个错误列表(列表中的1到20个)。我想创建一个显示列表的弹出窗口,无论用户使用何种字体或浏览器,该窗口的大小都能很好地容纳列表。我在sencha的小提琴中做了一个例子,展示了我的问题和我的非最优解决方案。请建议如何改进(或使用sencha中的其他机制来获得我想要的) 只是不要设定窗户的高度 工作示例:只是不设置窗口的高度 工作示例: Ext.application({ name: 'Fiddle', launch: function() { var e
只是不要设定窗户的高度
工作示例:只是不设置窗口的高度 工作示例:
Ext.application({
name: 'Fiddle',
launch: function() {
var errorTpl = new Ext.XTemplate('<tpl for=".">', '<ul class="thumb-wrap">', '<li><b>{Message}</b></li>', '</ul>', '</tpl>');
var errorView = Ext.create('Ext.view.View', {
layout: 'fit',
// data: errorList,
data: [{
Message: '1 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '2 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '3 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '4 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '5 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '6 alsfdjaslfkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}, {
Message: '7 alsfdjasl alsfdjasl alsfdjasl fkjas;fljksafjsakflsalfjsalf;safsa;lfsal;dfsalfd'
}],
tpl: errorTpl,
itemSelector: 'div.thumb-wrap'
});
var win = Ext.create('Ext.window.Window', {
title: 'Problems Found (Please Correct)',
modal: true,
layout: 'vbox',
width: 500,
height: 50 + errorView.data.length * 40,
items: [{
xtype: 'button',
margin: "10 10 10 10",
text: 'close',
listeners: {
click: function() {
this.up('window').close();
}
}
},
errorView]
}).show();
}
});
var htmlError = errorTpl.apply(errorList);
Ext.Msg.alert('Problems Found (Please Correct)',htmlError);