0

ユーザーデータを表示する ProfileView があります。MySql からデータを取得して Sencha ビューに表示するのはこれが初めてです。

景色

Ext.define('MyApp.view.Profile', {
extend : 'Ext.Panel',
xtype : 'profileview',

requires : ['Ext.List', 'Ext.data.Store'],

config : {
    layout: 'fit',
    title : 'Profiel',
    iconCls : 'user3',
    cls : 'home',
    scrollable : true,
    styleHtmlContent : true,
    html : ['<h1>Mijn Profiel</h1>'].join(""),
    items : [Ext.create('Ext.List', {
        title : 'Profile',
        docked : 'top',
        store : myStore,
        show : function(list, opts) {
            alert('list === ' + list);
            console.log('List Shown: ' + list);
        }
    })]
}

});

var myStore = Ext.create("Ext.data.Store", {
model : "MyApp.model.User",
proxy : {
    type : "ajax",
    url : "php/get_user.php",
    reader : {
        type : "json"
        // rootProperty : "users"
    }
},
autoLoad : true
});

データは正しく返されますが、何も表示されません。これを理解しようとしています。

応答

[{"ID":"19","USERNAME":"Annet","EMAIL":"annet@annet.nl"}]

単一のユーザーであるため、rootProperty をスキップしました。

モデル

Ext.define('MyApp.model.User', {
extend : 'Ext.data.Model',
config : {
    fields : [{
        name : 'ID',
        type : 'int'
    }, {
        name : 'USERNAME',
        type : 'string'
    }, {
        name : 'EMAIL',
        type : 'string'
    }]
}

});

では、なぜリストに何も表示されないのでしょうか?

アップデート

ストアにデータが含まれていることを確認します。

map: Object
ext-record-1: Class
_data: Object
EMAIL: "annet@annet.nl"
ID: 19
USERNAME: "Annet"
id: "ext-record-1"
__proto__: Object

リストに取り上げられないのはなぜですか？私もDataViewを試しました。

4

1 に答える 1

0

itemTplを使用する必要があります。コードを変更しました。

Ext.define('MyApp.view.Profile', {
extend : 'Ext.Panel',
xtype : 'profileview',

requires : ['Ext.List', 'Ext.data.Store'],

config : {
    layout: 'fit',
    title : 'Profiel',
    iconCls : 'user3',
    cls : 'home',
    scrollable : true,
    styleHtmlContent : true,
    html : ['<h1>Mijn Profiel</h1>'].join(""),
    items : [Ext.create('Ext.List', {
        title : 'Profile',
        docked : 'top',
        itemTpl : '<div>{ID} <span> {USERNAME} </span> <span> {EMAIL} </span> </div>',
        store : myStore,
        show : function(list, opts) {
            alert('list === ' + list);
            console.log('List Shown: ' + list);
        }
    })]
}
});
于 2013-02-27T08:58:26.617 に答える