1. 在initComponent中创建(自定义的)新类,并且添加到items中,初始化store,用于List显示数据:
NotesApp.views.MainView = Ext.extend(Ext.Panel,{
fullscreen: true,
layout: 'card',//used for tab and wizard implementations
cardSwitchAnimation: 'slide',//not in ST 2.0?, in ExtJs 4 used animation:{type: 'slide'} instead, for both TabPanel or Panel
initComponent: function(){// in ST 2.0 use constructor and evtl. callParent instead
Ext.apply(NotesApp.views,{
notesListView: new NotesApp.views.NotesListView({notesStore: NotesApp.stores.notesStore}),
noteEditorView: new NotesApp.views.NoteEditorView()
});
// NotesApp.views.notesListView = new NotesApp.views.NotesListView({notesStore: NotesApp.stores.notesStore});
// NotesApp.views.noteEditorView = new NotesApp.views.NoteEditorView();
this.items = [NotesApp.views.notesListView, NotesApp.views.noteEditorView];
NotesApp.views.MainView.superclass.initComponent.call(this);
this.on('render', function(){
/*
* there is a bug in the Sencha Touch version that the key in localstorage that
* keeps track of the IDs of the records will have duplicate IDs
*/
NotesApp.stores.notesStore.load();// Error: Cannot read property 'id' of null,this error is a bug, because of double id in cache
});
}
});
NotesApp.views.notesListView 可以用apply来创建,其中NotesApp.views是对应的namespace。在创建NotesListView时带了一个store类参数notesStore,这个store会在主界面加载时load数据,这样NotesListView在被加载到页面时就会显示数据。NotesListView中的变量notesStore将使用这个参数。
NotesApp.views.NotesListView = Ext.extend(Ext.Panel,{
notesStore: Ext.emptyFn,
...
this.notesList = new Ext.List({
store: this.notesStore,
...