Sencha touch Can'；我看不到屏幕上的数据，但我可以在元素中看到它_Sencha Touch

Sencha touch Can'；我看不到屏幕上的数据，但我可以在元素中看到它

sencha-touch

Sencha touch Can'；我看不到屏幕上的数据，但我可以在元素中看到它,sencha-touch,Sencha Touch,我是sencha touch的新手，所以如果有人能为我指出正确的方向，那就太好了。我的问题是我想显示数据库中的数据。当我检查元素时，我似乎一切正常。我看到了数据，但在屏幕上看不到数据。这是我的代码： getUserList.js Ext.regModel("User", { fields: [ "id", "name", "username",

我是sencha touch的新手，所以如果有人能为我指出正确的方向，那就太好了。我的问题是我想显示数据库中的数据。当我检查元素时，我似乎一切正常。我看到了数据，但在屏幕上看不到数据。这是我的代码：

getUserList.js

    Ext.regModel("User", {
            fields: [
                "id",
                "name",
                "username",
                "password",
                "email",
                "phone"
            ]
    });

    var myStore = new Ext.data.Store({
        model: 'User',
        proxy: {
            type: 'ajax',
            url : '../sencha/php/getUserList.php',
            reader: {
                type: 'json',
                root: 'results'
            }
        },
        autoLoad: true
    });



    var tpl = new Ext.XTemplate(
        '<tpl for=".">',
              '<div class="thumb-wrap" id="{id}">',
              '<div class="thumb">title="{name}"></div>',
              '<span class="x-editable">{name}</span></div>',
            '<div style="background-color:#00F" class="thumb-wrap" id="{id}">{id}</div>',
        '</tpl>',
        '<div class="x-clear"></div>'
    );

    var panel = new Ext.extend(Ext.Panel,{
        id:'images-view',
        frame:true,
        width:535,
        autoHeight:true,
        collapsible:true,
        layout:'fit',
        title:'Simple DataView',
        initComponent: function() {
            panel.superclass.initComponent.call(this);
        },

        items: new Ext.DataView({
            store: myStore,
            tpl: tpl,
            autoHeight:true,
            multiSelect: true,
            overItemCls:'x-view-over',
            itemSelector:'div.thumb-wrap',
            emptyText: 'No images to display'
        })
    });
    //panel.render(Ext.getBody());

      Ext.reg('userPanel', panel);

Ext.regModel（“用户”{
字段：[
“身份证”，
“姓名”，
“用户名”，
“密码”，
“电子邮件”，
“电话”
]
});
var myStore=new Ext.data.Store({
模型：“用户”，
代理：{
键入：“ajax”，
url:“../sencha/php/getUserList.php”，
读者：{
键入：“json”，
根：“结果”
}
},
自动加载：正确
});
var tpl=new Ext.XTemplate(
'',
'',
'title=“{name}”>”，
“{name}”，
“{id}”，
'',
''
);
var面板=新的Ext.extend（Ext.panel{
id:'images-view'，
框架：对，
宽度：535，
自动高度：正确，
可折叠的：是的，
布局：'适合'，
标题：“简单数据视图”，
initComponent:function（）{
panel.superclass.initComponent.call（this）；
},
项目：新建Ext.DataView({
商店：myStore，
第三方物流：第三方物流，
自动高度：正确，
多选：对，
overItemCls:'x-view-over'，
itemSelector:'div.thumb-wrap'，
emptyText:“没有要显示的图像”
})
});
//panel.render（Ext.getBody（））；
Ext.reg（“用户面板”，面板）；

index.html

<!DOCTYPE html>

使用者

     <script type="text/javascript" src="sencha/sencha-touch.js"></script> 
     <script type="text/javascript" src="js/getUserList.js"></script> 

    <link href="sencha/resources/css/sencha-touch.css" rel="stylesheet" type="text/css" />



   <script type="text/javascript">
        var topPanel = {
            style: 'padding:15px; background-color: #F00',
            html: 'color2'
        };

        new Ext.Application({
            launch: function() {
                new Ext.Panel({
                    fullscreen: true,
                    layout: {
                        type: 'hbox',
                        align: 'stretch'
                    },
                    items:[{
                           xtype: 'userPanel'
                           }],
                    dockedItems: [topPanel]
                });
            }
        });        

</script>


</head>
<body></body>


var topPanel={
样式：“填充：15px；背景色：#F00”，
html:'color2'
};
新的外部应用程序({
启动：函数（）{
新分机面板({
全屏：对，
布局：{
类型：“hbox”，
对齐：“拉伸”
},
项目：[{
xtype:'userPanel'
}],
dockedItems:[topPanel]
});
}
});

谢谢你能提供的任何帮助

我明白了，我必须在index.html文件中的xtype中添加一个布局