翻譯 Ext JS 5 0 1 中的新功能

2021-09-03 04:07:32 字數 3554 閱讀 9052

原文:

what』s new in ext js 5.0.1

今天,我們很高興的宣布ext js 5.0.1發布了!此維護版本基於sencha社群的反饋做了一些改進。

下面讓我們來了解一下這些改變。

與ext js 4.2.2一起,我們發布了「ext-aria」包來為可訪問性提供了改進的支援(如wai-aria 1.0標準中所描述的)。對於提供工具來讓提高應用程式的可訪問性來說,這是很重要的一步,我們還從測試合作夥伴和早期採用者的反饋意見中學到了一些東西。

隨著ext js 5的發布,我們希望能綜合反饋意見並提供乙個更好的解決方案。我可以很高興的宣布,對於ext js 5.0.1,對於可訪問性的支援已經改進了許多。很大程度上,這是因為我們已經將焦點和鍵盤導航的支援從「ext-aria」移動到了框架本身。

在ext js 5.0.1,我們大大的改進了焦點的內部處理方式以便更好的符合可訪問性標準。核心元件(如按鈕、標籤、表單字段和網格)現在可以完全提供乙個清晰、視覺指示的焦點。這是可訪問性應用程式的關鍵需求。為了讓你可以完全控制這些新的視覺方法的東西,我們已經新增了幾個新的sass變數和混入(mixin)引數。

之前版本的ext js會使用ext.focusmanager來輔助管理焦點。雖然該類仍然存在,但它不再是推薦的方法。相反,所有元件現在都帶有「focusable」屬性,可用來管理dom屬性tabindex。將該屬性設定為true的任何元件都可通過單擊或鍵盤來接收焦點。

當這些可獲得焦點的元件被放置在某些容器(如工具欄)時,容器會提供箭頭鍵盤導航並可管理容器內的哪一些條目可以接收焦點。

還有許多與可訪問性、焦點和鍵盤導航改進有關的資訊,要想詳細了解這些,可以閱讀可訪問性指南。

在很大程度上,已經看到了開發人員是如何迅速的拿起檢視模型和資料繫結。除了一般的bug修復外,還有一些值得注意的改進是與繫結有關的。

許多開發人員已經要求我們在哪些支援選擇的元件上擴充套件繫結屬性的能力(如組合框、網格、樹、breadcrumbs等等),以便支援選擇。

現在,在同步的時候,可以使用繫結來保持這些元件的選擇,有關這方面的詳細資訊,可參閱kitchen sink示例。

表單字段的一項關鍵改進是,現在在更新他們的繫結屬性之前,雙向繫結會驗證值是否有效。為了實現這個,在將模型繫結到字段的時候,表單自動現在會獲取模型的驗證並將它包含在自己的驗證裡。

在ext js 5.0.0,這些驗證只在第一次返回值(可能是無效的)的時候作為參考。而在ext js 5.0.1,終於可以放心了,因為無效值將永遠不糊返回到記錄中。

在此版本,ext.data也有一些重要的修復和改進。

在ext js 5.0.0,treestore類被重構為派生於ext.data.store。然而,在此過程中,存在乙個關鍵問題:treestore不會從根節點(ext.data.nodeinte***ce)傳播事件。

對於大多數由樹節點除非的事件來說,一切如常。不過,某些節點事件在建立監聽的時候可能會與儲存事件發生衝突,如remove事件。

對 於這個問題,唯一安全和有效的修復是,在將所以節點事件作為treestore事件觸發之前,在事件前新增字首node,這意味著節點的remove事件 現在會作為treestore的noderemove事件觸發。在維護版本中,我們一直在努力去避免這種更改,但這實在是沒有其他辦法在不破壞任何接單監 聽或儲存監聽的情況去解決這個問題。對於這種變化造成的不便,我們深表歉意。

在ext js 5.0.0中,對於關聯的限制是,如果你要建立乙個新記錄然後刪除該記錄,就會發現沒有清理邏輯來處理它潛在的子記錄,這可能會造成生成、建立或更新這些子記錄的操作會話,但在伺服器端卻無法處理這些操作,因為沒有父記錄不存在。

在ext js 5.0.1中,在移除記錄的時候,被宣告為模型之間父所有者或子所有者的reference欄位會被作為參考,當表示的是這種型別的關聯時,移除記錄將會自動去刪除他的子記錄。

例如:        extend: 'ext.data.model',

// ...

}); 

extend: 'ext.data.model', 

fields: [

}]});

這樣,當order被移除(標記為刪除)的時候,它的子orderitems將同樣被移除:

order.drop();

另外,設定父的references為null(例如,通過與父的關聯儲存刪除它)也可以清理這些記錄:

order.orderitems().removeat(0); // removed orderitem is dropped 

order.orderitems().getat(0).setorder(null); // also drops this item

伺服器仍然可以負責最終的完整級聯刪除,不過上述處理需要確保客戶端永遠不會在儲存操作中引用移除的記錄。

新的responsiveconfig是由ext.mixin.responsive提供的,而ext.plugin.responsive提供的是一些針對管理動態條件清理的靈活性。

新的responsiveformulas允許為responsiveconfig規則新增可用屬性,例如,主控制器可以使用以下方式來發布新的屬性:

extend: 'ext.container.container', 

mixins: [

'ext.mixin.responsive'

], responsiveformulas: 

}});

在以上**中,新的值(small等)就可以使用在其他的responsiveconfigs中。這有助於簡化應用程式的responsiveconfigs,以及在乙個地方維護這些選擇。

「sencha-charts」包也有幾個改進,如可重用的標記(箭頭、菱形等)。對於那些不使用sencha cmd的初學者來說,sencha-charts包已經包含在ext js 5.0.1的生成包中。最顯著的改變是在文件中已經說明了如何去建立自定義圖表的主題。

在ext js 5.0.0,可以為圖表選擇附帶的幾個內建主題,不過建立自定義主題則沒有任何文件進行說明。在當前版本,已經提供了這種能力,從而你可以製作自己的調色盤和其他更多東西。

圖表的主題是乙個派生於ext.chart.theme.base,且別名是以「chart.theme.」開頭的類,基本的主題就像以下**那樣簡單:

extend: 'ext.chart.theme.base', 

singleton: true,

alias: 'chart.theme.awesome', 

config: 

});

theme: 'awesome'

為了一窺這些有用的新控制,我們來研究下輸出物件。在某些環境中,最常見的要求是要在資料夾之外保持「標記」檔案以表明sencha應用程式所在,例如:

foo.php

foo/

}}

以上**就可禁用生成步驟,以確保所有路徑都會根據父資料夾來計算好相對路徑後再重寫標記檔案。輸出物件還可以控制生成輸出方面,從啟用編譯器優化到調整微載入方面等許多東西。

,

"ios": }},

"android": }}

}}

基於以上**,可以執行以下**來指定生成:

以上**是用來生成web生成的。現在還可以這樣進行生成:

從零開始學習Extjs5 01搭建環境

因業務需要公司讓學習extjs 本人之前並未接觸過這個東西,完全從零開始,不過話隨如此,但是怎麼也得要有些j2ee的相關知識基礎才能開始學習,廢話不多說 開始搭建環境 1 jdk安裝 4 安裝ruby 網上有教程 安裝成功後,在命令列引數後跟 sencha sdk 引數1 引數2 來建立extjs的...

Extjs中的迭代

extjs 有很多的迭代方法,例如,你也許已知道的ext.each,但還有另外一些不為人知且很有用的方法。首先,簡要回顧下ext.each ext.each 為每乙個陣列的成員應用同乙個方法,它基本上是乙個更方便的迴圈形式 var people bill saul gaius using each ...

Extjs中的迭代

extjs 有很多的迭代方法,例如,你也許已知道的ext.each,但還有另外一些不為人知且很有用的方法。首先,簡要回顧下ext.each 為每乙個陣列的成員應用同乙個方法,它基本上是乙個更方便的迴圈形式 var people bill saul gaius using each to detect...