一、问题描述:
在Container中加入Ext.grid.Panel 时,发生如下错误:
百度一下,仍未果。
二、解决文案:
对比之前写的代码,发现,只要在父元素中,加入width:X%即可解决。
三、代码:
从网上搜的各种都解决不了此问题,现上传错误与正确代码:
1、错误代码:
{
xtype: 'container',
layout: {
type: 'hbox'
},
items: [
{
xtype: 'label',
html: '优惠设置'
},
{
xtype: 'grid',
flex: 1,
name: 'discounts-setup',
store: {
type: 'commoditytitleinfostore',
data: [{
product_id: 1,
image: 'http://xxxxx.c.jpg',
name: 'Lisa',
current_price: 55,
discount_amount: 22.1,
quantity: 88
}]
},
columns: [
{
text: '商品名称',
align: 'center',
xtype: 'widgetcolumn',
widget: {
xtype: 'commoditytitleinfo',
bind: {
bindData: {
name: '{record.name}',
image: '{record.image}'
}
}
}
},
{
text: '价格',
dataIndex: 'current_price'
}
]
}
]
},
2、正确代码:
{
xtype: 'container',
width: '80%',//******此处要加
layout: {
type: 'hbox'
},
items: [
{
xtype: 'label',
html: '优惠设置'
},
{
xtype: 'grid',
flex: 1,//此处要加
name: 'discounts-setup',
store: {
type: 'commoditytitleinfostore',
data: [{
product_id: 1,
image: 'http://xxxx.c.jpg',
name: 'Lisa',
current_price: 55,
discount_amount: 22.1,
quantity: 88
}]
},
columns: [
{
text: '商品名称',
align: 'center',
xtype: 'widgetcolumn',
widget: {
xtype: 'commoditytitleinfo',
bind: {
bindData: {
name: '{record.name}',
image: '{record.image}'
}
}
}
},
{
text: '价格',
dataIndex: 'current_price'
}
]
}
]
}
网上有说是layout类型不对,要改为fit,这里不需要更改layout的type配置项。
注:我的版本号是6.2.1 gpl。