Невозможно получить представление, чтобы отобразить данные хранилища в Sencha Touch

Question

Я пытаюсь отобразить список простых данных в Sencha-Touch 2. По какой-то причине он не отображает данные, и я не могу понять это , Я получаю два заголовка: правильный заголовок с «Последние сообщения» и пустой под ним. Я не знаю, почему так происходит. Возможно, это противоречит остальной части дисплея?

Ext.define('GS.view.NewBlog',{ 
    extend: 'Ext.navigation.View', 
    xtype: 'newblog', 
    requires: [ 
     'Ext.dataview.List', 
      'Ext.TitleBar' 
    ], 

config: { 
    title: 'Blog', 
    iconCls: 'star', 
      items: { 
        docked: 'top', 
        xtype: 'titlebar', 
        title: 'Recent Posts' 
      }, // end items 
      store: { 
       fields: ['title','author'], 
       data: [ 
        {title: 'This is the first Title', author: 'John Smith'}, 
        {title: 'This is the second title', author: 'Jane Doe'} 
       ] // end data 
      } // end store 

    }, // end config 
itemTpl: '{title}' 
}); 

Answer 1

1. Строка заголовка отображается дважды, потому что вы используете Ext.navigation.View, который по умолчанию имеет заголовок. И вы добавляете еще одну строку заголовка в элементы.

2. Теперь определите store и itemtpl внутри элемента внутри конфигурации. Вы можете определить хранилище отдельно и указать идентификатор магазина внутри магазина.

   элементы: [{ xtype: 'список', магазин: «идентификатор магазина идет здесь, itemTpl: '{название}} ]

Answer 2

Вы должны определить магазин:

Ext.define('GS.store.Posts', {` 

    extend: 'Ext.data.Store',` 
    config: { 
     data: [ 
      { 
       title: 'This is the first Title', 
       author: 'John Smith' 
      }, 
      { 
       title: 'This is the second title', 
       author: 'Jane Doe' 
      } 
     ], 
     storeId: 'Posts', 
     fields: [ 
      { 
       name: 'title' 
      }, 
      { 
       name: 'author' 
      } 
     ] 
    } 
}); 

Define панель со списком с помощью магазина:

Ext.define('GS.view.NewBlog', { 
    extend: 'Ext.Panel', 
    alias: 'widget.NewBlog', 

    config: { 
     layout: { 
      type: 'card' 
     }, 
     items: [ 
      { 
       xtype: 'toolbar', 
       docked: 'top', 
       title: 'Recent Posts' 
      }, 
      { 
       xtype: 'list', 
       itemTpl: [ 
        '<div>{title} - {author}</div>' 
       ], 
       store: 'Posts' 
      } 
     ] 
    } 

}); 

Ваш app.js:

Ext.Loader.setConfig({ 
    enabled: true 
}); 

Ext.application({ 
    stores: [ 
     'Posts' 
    ], 
    views: [ 
     'NewBlog' 
    ], 
    name: 'GS', 

    launch: function() { 

     Ext.create('GS.view.NewBlog', {fullscreen: true}); 
    } 

});