【extjs6學習筆記】0.1 準備：基礎概念（02）

標籤：有用   重寫   指定   nod   儲存資料   數組   html   remove   伺服器端   

Ext 類

Ext 是一個全域單例的對象，在 Sencha library 中它封裝了所有的類和許多實用的方法。許多常用的函數都定義在 Ext 對象裡。它還提供了像其他類中一些頻繁使用的方法的快速調用。

??

define 方法

你可以用這個方法定義或者重寫一個類。 這個方法有三個參數，如以下代碼所示。 在這裡 name 參數是你要定義的類名，data 參數是應用於這個類的屬性，callback 是選擇性參數，這個函數將會在這個類被建立後調用：

??

Ext.define(name,data, callback)

extend 會建立一個新的類，並繼承父類的屬性和方法，你也可以重寫父類的方法。而 override 並不會建立一個新的類，而是修改這個被重寫的父類。

??

create 對象

建立一個類的執行個體：

??

getClass

如果建立的執行個體是用 Ext.define 定義的，那麼返回這個給定對象的類，否則返回 null：

??

getClassName

通過它的引用或執行個體返回類名稱：

??

-----------------------------------------------------------------------------

??

訪問 DOM

有三種方法來訪問 DOM 元素：get，query，和 select 。

??

Ext.get

get 方法是根據這個 DOM 元素的 ID 檢索擷取並封裝為 Ext.dom.Element 對象：

??	var mydiv = Ext.get(‘myDivId‘);

Ext.query

這種方式基於傳入的 CSS 選取器 從給定的根節點開始尋找。它返回一個匹配選取器的元素(HTMLElement[]/Ext.dom.Element[])數組。如果沒有匹配的，返回一個空值的數組對象。

在下面樣本中，myCustomComponent.getEl().dom 是傳遞的根節點。Ext.query 將檢索這個節點內的子項目，並返回一個數組包含 CSS class 為 ‘oddRow‘ 的的元素：

??	var someNodes = Ext.query(‘.oddRow‘, myCustomComponent.getEl().dom);

??

Ext.select

給出一些 CSS/XPath 選取器，Ext.select 方法返回一個 CompositeElement 類型的對象，代表一個元素的集合。

這個 CompositeElement 對象可以進行過濾，迭代，和對整個集合執行整體操作等等：

?? ??

var rows = Ext.select(‘div.row‘); ////Matches all divs with class row rows.setWidth(100); // 這是設定所有元素的寬度為 100

??

你也可以用一行代碼，如下所示：

??	Ext.select(‘div.row‘).setWidth(100);

??

--------------------------------------------------------------------------------

??

Store

一個 store 代表一個 模型的執行個體 的集合并用於代理擷取資料。store 還定義了集合操作，例如 排序，過濾等等。它是通過擴充 Ext.data.Store 定義的。

??

Store 事件

store 提供了很多可監聽的事件。store 的一些常用事件：

• add: 當一條記錄添加到 store 後調用
• beforeload: 在載入資料之前調用
• beforesync: 在進行同步操作之前調用
• datachanged: 當 store中的記錄產生新增或刪除時觸發調用
• load: 當 store 讀取一個遠端資料源後觸發調用
• remove: 從 store 移除一條記錄觸發調用
• update: 當 store 中的一條記錄被更新觸發調用

??

??

--------------------------------------------------------------------------------

??

代理

所有的 stores 和 models 使用 proxy 來載入和儲存資料。在代理中使用這個配置你可以指定如何讀取和寫入資料。你也可以指定調用 URL 讀取資料；你可以告訴讀取器這些資料的格式，不論是 JSON 還是 XML ，等等。

有兩種類型的代理：用戶端代理和伺服器代理。

用戶端代理

用戶端代理是用於處理用戶端本身資料的載入和儲存。這氛圍三種用戶端代理：記憶體，本機存放區，和會話儲存。

??

??

??

??

伺服器端代理

伺服器端代理是向伺服器通訊來讀取或儲存資料。有四種代理：

• Ajax: 用於非同步請求資料
• Direct: 使用 Direct 與伺服器通訊
• JSONP (JSON with padding): 這很有用，當你需要發送跨域請求時。而 ajax 只能請求相同的域。
• REST: 這會向伺服器發送一個 ajax 請求，使用 RESTful 的風格，例如 GET，POST，PUT，和 DELETE。

??

??

【extjs6學習筆記】0.1 準備：基礎概念（02）