Создание моделей и хранилища
Первым делом создадим модели и хранилище, которое будет содержать объекты данной модели.
Файл модели будет называться Book.js и мы его поместим в каталог BookApp/app/model/:
Ext.define('BookApp.model.Book', { extend: 'Ext.data.Model', fields: ['id','name', 'author', 'year'] });
Тут все просто. Поскольку в прошлом параграфе в файле app.js мы определили имя приложения BookApp:
name: 'BookApp', appFolder: 'app',
то название BookApp фактически будет сопоставляться с каталогом app. Например, у нас модель находится в папке app/model,
то ее название будет начинаться с BookApp.model, то есть в данном случае: BookApp.model.Book
.
Модель Book определяет четыре поля: 'id','name', 'author', 'year'
.
В каталог BookApp/app/store поместим файл хранилища, который будет называться BookStore.js:
Ext.define('BookApp.store.BookStore', { extend: 'Ext.data.Store', model: 'BookApp.model.Book', autoLoad: true, storeId: 'BookStore', proxy: { type: 'ajax', url: 'app/data/books.json', reader: { type: 'json', root: 'books', successProperty: 'success' } } });
Опять же обратите внимание, поскольку файл хранилища расположен в папке app/store, то класс хранилища будет называться BookApp.model.Book.
Хранилище автоматически реализует загрузку данных из файла books.json.
Итак, добавим в каталог BookApp/app/data/ файл books.json со следующим содержанием:
{ "success": true, "books": [ {"id": 1, "name": 'Война и мир', "author": 'Л. Толстой', "year": 1863}, {"id": 2, "name": 'Отцы и дети', "author": 'И. Тургенев', "year": 1862}, {"id": 3, "name": 'Евгений Онегин', "author": 'А. Пушкин', "year": 1825} ] }
На этом по сути работа с уровнем модели и данных закончена. Теперь перейдем к представлению.