0

ここで学んだように、新しく作成された Sencha Touch 2 アプリに基づいています。次に、ネストされたリストを追加したいと思います-階層メニューツリーで、問題ではないことがわかりました-インラインストアまたはjsonから読み取ったストア-タブ「メニュー」内に何も表示されません。どうしたの？

重要なファイル/コード フラグメント:

app.js の MVC セクション:

// MVC
    views: [
        'Main'
    ],
    models: [
        'MenuItem'
    ],
    stores: [
        'MenuTree'
    ],

ビュー.Main.js:

Ext.define('MobilePost.view.Main', {
    extend: 'Ext.tab.Panel',
    xtype: 'main',
    requires: [
        'Ext.TitleBar',
        'Ext.data.TreeStore',
        'Ext.dataview.NestedList',
        'Ext.data.proxy.JsonP',
        'MobilePost.store.MenuTree'
    ],

    config: {
        tabBarPosition: 'bottom',

        items: [
            {
                            // From tutorial, working
                title: 'Home',
                iconCls: 'home',
                cls: 'home',
                html: [
                    '<img src="http://staging.sencha.com/img/sencha.png" />',
                    '<h1>Welcome to Sencha Touch</h1>'
                ].join("")
            },
            {
                            // From tutorial, working
                xtype: 'nestedlist',
                title: 'Blog',
                iconCls: 'star',
                displayField: 'title',

                store: {
                    type: 'tree',

                    fields: [
                        'title', 'link', 'author', 'contentSnippet', 'content',
                        { name: 'leaf', defaultValue: true }
                    ],

                    root: {
                        leaf: false
                    },

                    proxy: {
                        type: 'jsonp',
                        url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog',
                        reader: {
                            type: 'json',
                            rootProperty: 'responseData.feed.entries'
                        }
                    }
                },

                detailCard: {
                    xtype: 'panel',
                    scrollable: true,
                    styleHtmlContent: true
                },

                listeners: {
                    itemtap: function( nestedList, list, index, element, post ) {
                        this.getDetailCard().setHtml(post.get('content'));
                    }
                }
            },
            {
                            // Mine, not working
                xtype: 'nestedlist',
                title: 'Menu',
                iconCls: 'settings',
                store: 'MenuTree'
            }
        ]
    }
});

モデル - model.MenuItem.js:

Ext.define('MobilePost.model.MenuItem', {
    extend: 'Ext.data.Model',
    config: {
        fields: [ 
            'id',   // Menu item id for events
            'text', // Menu item text 
            { name: 'leaf', defaultValue: false }
        ]
    }
});

ストア - store.MenuTree.js:

Ext.define('MobilePost.store.MenuTree', {
    extend: 'Ext.data.TreeStore',

    requires: [ 'MobilePost.model.MenuItem' ],

    type: 'tree',
    defaultRootProperty: 'items',
    config: {
        model: 'MobilePost.model.MenuItem',
        /*
        // TODO: inline store - uncomment to use
        root: {
            items: [
                {
                    id: 'settings',
                    text: 'Settings',
                    items: [
                        {
                            id: 'shift',
                            text: 'Working shift',
                            leaf: true
                        },
                        {
                            id: 'users',
                            text: 'Users',
                            leaf: true
                        },
                        {
                            id: 'cash',
                            text: 'Cash',
                            leaf: true
                        }
                    ]
                }
            ]
        }*/
        // TODO: JSON store - comment for inline store
        proxy: {
            type: 'ajax',
            url: 'menu.json'
        }
    },
    // TODO: JSON store - comment for inline store
    root: {}
});

JSON - menu.json (有効で、jsonlint.com によるチェックに合格):

{
    "items": [
        {
            "id": "settings",
            "text": "Settings",
            "items": [
                {
                    "id": "shift",
                    "text": "Working shift",
                    "leaf": true
                },
                {
                    "id": "users",
                    "text": "Operators",
                    "leaf": true
                },
                {
                    "id": "cash",
                    "text": "Cash",
                    "leaf": true
                }
            ]
        }
    ]
}
4

1 に答える 1

0

あなたのストアはどの時点でロードされますか? autoLoad:trueあなたのお店では使いませんか？

また、アプリケーションのロードでストアを作成してロードしたくない場合は、必要に応じて手動でストアを作成し、リストに設定する必要があります

var treeStore = Ext.create('MobilePost.store.MenuTree');
treeStore.load();

これをビューのストア属性として使用します

        {
            // Mine, not working
            xtype: 'nestedlist',
            title: 'Menu',
            id: 'myListId',
            iconCls: 'settings',
            store: treeStore
        }

または、ビューが既に作成されている場合はストアを設定します

Ext.getCmp('myListId').setStore(treeStore);
于 2013-04-17T05:08:25.847 に答える