extjs 6.2.0网格列按标题设置宽度(标题)
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了extjs 6.2.0网格列按标题设置宽度(标题)相关的知识,希望对你有一定的参考价值。
如何在extjs 6.2.0中按标题(标题)设置列宽?
我想自动设置列标题内容的宽度
答案
列的宽度必须为null:
var c = Ext.create('Ext.grid.column.Column', { text: 'Nam12131231313e', dataIndex: 'name', width: null});
另一答案
如您所见,我创建了一个函数getColumnWidth(),它将网格列文本作为参数,然后返回列宽。
您还可以根据需要调整getColumnWidth()中的数字。
Sencha Fiddle链接https://fiddle.sencha.com/#view/editor&fiddle/2l1r
Ext.application({
name : 'Fiddle',
launch : function() {
Ext.create('Ext.window.Window',{
title:'Grid Auto Fit Column Width Based on Header Text',
width:600,
height:400,
autoShow:true,
layout:'fit',
items:[{
xtype:'grid',
columns:[
{
text:'id',
width:this.getColumnWidth('id'),
},{
text:'Name',
width:this.getColumnWidth('Name'),
},{
text:'ThisWillFitItsData',
width:this.getColumnWidth('ThisWillFitItsData')
},{
text:'LetsTryMoreLongerText',
width:this.getColumnWidth('LetsTryMoreLongerText')
},{
text:'Fixed',
width:60
}
]
}]
});
},
getColumnWidth:function(text){
let columnWidth = (text.length * 7) + 35 // giving 7 pixles for each letter in the text
//Optional This part is used to set a maximum column width in case there is too many charachter in the text
if(columnWidth>400){
columnWidth = 400
}
return columnWidth;
}
});
以上是关于extjs 6.2.0网格列按标题设置宽度(标题)的主要内容,如果未能解决你的问题,请参考以下文章