2012-01-23 144 views
0

我有一个简单的MVC Sencha Touch应用程序,有1个商店,2个模型和2个视图 - 一个工具栏和一个列表。我的工具栏呈现正常,但列表没有。没有例外被抛出,我无法找到我做错了什么。 ( - 这使得细我有另一个Bar.js List.js)Sench Touch 2 - 呈现列表

Ext.define('App.store.Books', { 
    extend: 'Ext.data.Store', 
    model: 'App.model.Book', 
    autoLoad: true, 
    data: [ 
    { id: '1', name: '1984', publisher: 'Orwell' }, 
    { id: '2', name: 'Biography', publisher: 'abcde' }, 
    { id: '3', name: 'The Old Man and the Sea', publisher: 'Hemingway' } 
    ] 
}); 

的视图:

Ext.define('App.view.List', { 
    extend: 'Ext.List', 
    store : 'Books', 
    xtype : 'mylist', 
    itemTpl: '<div><strong>Name: {name}</strong>Publisher: {publisher}</div>' 
}); 

视口(Viewport.js

商店(Books.js) ) - 扩展Ext.Container正如我在几个例子中看到:

Ext.define('App.view.Viewport', { 
    extend: 'Ext.Container', 
    requires : [ 
     'App.view.Bar', 
     'App.view.List' 
    ], 
    config: { 
     fullscreen: true, 
     layout: 'fit', 
     items: [ 
     { 
      xtype : 'toolbar', 
      docked: 'top' 
     }, 
     { 
      xtype: 'mylist' 
     } 
     ] 
    } 
}); 

正如我写的 - 我的工具栏显示,我的名单(“MYLIST”)不是。 我错过了什么或做错了什么?

感谢

回答

1

尝试增加一个配置到您的视图

Ext.define('App.view.List', { 

    extend: 'Ext.List', 
    config: { 

     title: 'Books', 
     cls:  'books', 
     store: 'Books', 
     itemTpl: '<div><strong>Name: {name}</strong>Publisher: {publisher}</div>' 

    } 

});