Ext.js - Data

Pakiet danych służy do wczytywania i zapisywania wszystkich danych w aplikacji.

Pakiet danych ma wiele klas, ale najważniejsze to -

• Model
• Store
• Proxy

Model

Podstawową klasą modelu jest Ext.data.Model. Reprezentuje jednostkę w aplikacji. Wiąże dane sklepu do wyświetlenia. Ma mapowanie obiektów danych zaplecza do widoku dataIndex. Dane są pobierane za pomocą sklepu.

Tworzenie modelu

Aby stworzyć model, musimy rozszerzyć klasę Ext.data.Model i zdefiniować pola, ich nazwy oraz mapowanie.

Ext.define('StudentDataModel', {
   extend: 'Ext.data.Model',
   fields: [
      {name: 'name', mapping : 'name'},
      {name: 'age', mapping : 'age'},
      {name: 'marks', mapping : 'marks'}
   ]
});

Tutaj nazwa powinna być taka sama jak dataIndex, którą deklarujemy w widoku, a mapowanie powinno pasować do danych statycznych lub dynamicznych z bazy danych, które mają zostać pobrane za pomocą store.

Sklep

Podstawową klasą sklepu jest Ext.data.Store. Zawiera dane przechowywane lokalnie w pamięci podręcznej, które mają być renderowane na widoku za pomocą obiektów modelu. Sklep pobiera dane przy użyciu serwerów proxy, które mają ścieżkę zdefiniowaną dla usług do pobierania danych zaplecza.

Dane sklepu można pobierać na dwa sposoby - statyczny lub dynamiczny.

Sklep statyczny

W przypadku sklepu statycznego będziemy mieć wszystkie dane obecne w sklepie, jak pokazano w poniższym kodzie.

Ext.create('Ext.data.Store', {
   model: 'StudentDataModel',
   data: [
      { name : "Asha", age : "16", marks : "90" },
      { name : "Vinit", age : "18", marks : "95" },
      { name : "Anand", age : "20", marks : "68" },
      { name : "Niharika", age : "21", marks : "86" },
      { name : "Manali", age : "22", marks : "57" }
   ];
});

Sklep dynamiczny

Dane dynamiczne można pobrać za pomocą proxy. Możemy mieć proxy, które może pobierać dane z Ajax, Rest i Json.

Pełnomocnik

Klasą bazową serwera proxy jest Ext.data.proxy.Proxy. Serwer proxy jest używany przez modele i sklepy do obsługi ładowania i zapisywania danych modelu.

Istnieją dwa typy serwerów proxy

• Serwer proxy klienta
• Serwer proxy

Serwer proxy klienta

Serwery proxy klienta obejmują pamięć i lokalną pamięć masową przy użyciu lokalnego magazynu HTML5.

Serwer proxy

Serwery proxy obsługują dane ze zdalnego serwera przy użyciu Ajax, danych Json i usługi Rest.

Defining proxies in the server

Ext.create('Ext.data.Store', {
   model: 'StudentDataModel',
   proxy : {
      type : 'rest',
      actionMethods : {
         read : 'POST'  // Get or Post type based on requirement
      },
      url : 'restUrlPathOrJsonFilePath', // here we have to include the rest URL path 
      // which fetches data from database or Json file path where the data is stored
      reader: {
         type : 'json',  // the type of data which is fetched is of JSON type
         root : 'data'
      },
   }
});