控制器在Extjs應用程序中如何與MVC一起使用

Question

我對Extjs相當陌生，在瀏覽一些關於Extjs MVC模式的教程和博客後，我不清楚複雜的應用程序（如10 - 15頁導航）如何建立在extjs平臺上。

從sencha論壇，建議所有的控制器都需要在app.js中預先定義（因爲與加載DOM的UI相比，手動加載控制器不會成爲性能問題。由sencha論壇經理）。

通過上面的方法去，我還有幾個問題：

• 何時控制器實例化？當應用程序加載時，它們是否全部加載並安裝，並且一直監聽它們中定義的事件，直到應用程序的整個生命週期？

• 在控制器類中定義Models []，Stores []和Views []是什麼意思？他們什麼時候加載並實例化？

• 頁面導航如何與控制器一起工作？如果導航到新頁面僅轉換爲getParentContainer.remove（componentX）和getParentContainer.add（componentY），那麼控制器的目的僅僅是處理事件的文件？

• 控制器是否有任何範圍（實例化>銷燬）？如果不是如何創建和銷燬多個實例，以便我的行爲不會被錯誤的實例監聽（我見過一些提到控制器的博客大多是單例）？

有人可以拋出一些燈光嗎？任何示例/插圖都會有很大的幫助。

由於

Answer 1

在分機JS，Ext.app.Controller類（開箱）與所述應用程序的初始化實例化。事實上，控制器的init（）在應用程序本身的launch（）之前被調用。所以是的，控制器是「生命力」，從應用程序在應用程序的整個生命週期開始的那一刻開始監聽。有是動態創建和銷燬控制器的方法，但這需要一個自定義的實現。

但是，在Ext JS 5中引入了ViewController的概念。它擴展了與Ext.app.Controller相同的基礎（Ext.app.BaseController），但與上面不同，ViewController與綁定的視圖實例一起創建和銷燬。這是由框架自動處理的 - 不需要定製的實現以使其工作。

關於模型：[]，stores：[]和views：[]，這些基本上是對控制器的require（），指示它確保加載這些類。這些約定只是從它們的特定名稱空間（例如，AppName.view，AppName.store等）中要求這些類的簡寫方式。在視圖和商店的情況下，這個約定也會爲所需的類生成getters。

關於導航，這取決於你。有很多方法可以創建您的Ext JS應用程序。你可以做「單頁」應用程序，其中的導航可能類似於你提到的非常密切（我的很多）。您還可以創建多頁面應用程序，這些應用程序可以爲網站提供更傳統的頁面到頁面的感覺，但是會根據每個頁面的需求爲每個頁面利用通用代碼和類。

最後，關於聽衆碰撞的問題，答案是「它要看」。如果您使用的是Ext JS 4，那麼只有擁有「lifer」控制器，因此避免聽衆中的碰撞是一個非常瞭解您在listen（）或control（）中使用的選擇器的問題。部分，並確保您不會複製監聽器（通過顯式複製或者選擇器過於寬泛），除非您希望這樣做。但是，對於Ext JS 5，ViewController概念或多或少地消除了這種擔憂，因爲ViewController的「監聽」域被限制在綁定的視圖實例上。

至於例子，我肯定會鼓勵你開始與Ext JS的5文檔：

http://docs.sencha.com/extjs/5.0/whats_new/5.0/whats_new.html

http://docs.sencha.com/extjs/5.0.1/

的「最新消息」文檔中有一些真正偉大的建築討論其中深入探討這些概念的細節遠遠超過SO的可行性。