Javascript 在Sencha Touch2列表中水平滚动

我有一个带有以下配置的列表

var grid = Ext.create('Ext.List', {
            scrollable: {
            direction: 'horizontal',
            directionLock: true
        },

    store: compStore,
    itemTpl: '<table width="2000px">
<tr><td width="500px" style="border 1px solid black">{company}</td>
<td width="200px">{price}</td>
<td width="200px">{change}</td>
<td width="200px">{pct}</td>
<td width="200px">{updated}</td>
</tr></table>'

    });

var grid=Ext.create（'Ext.List'{
可滚动：{
方向：'水平'，
方向锁：正确
},
商店：康普商店，
itemTpl:'
{公司}
{price}
{change}
{pct}
{更新}
'
});

我只能看到屏幕上的前3个字段（它们是：company、price、change），其余的列表列我无法看到，因为表太大，无法放入视图空间

当我滚动列表（水平）时，我可以看到其他字段，但在释放后，它再次消失

正如您在所附图像中看到的，列表仅显示部分列，我无法（水平）滚动列表

当列表中的内容宽度较大时，如何水平滚动列表

非常感谢您的帮助。

使用

scrollable: {
        direction: 'both',
        directionLock: true
},

---

尝试使用具有相对宽度的

div

s，而不是

表

。因为Sencha生成的div不能很好地处理表。