什麼是extjs4中的視口面板

extjs4中的「視口>面板」是什麼意思？什麼時候會被叫？使用它的意義是什麼？什麼是extjs4中的視口面板

init : function() { 
    console.log('In init function'); 
    this.control({ 
     'viewport > panel' : { 
      render : this.onPanelRendered 
     } 
    }); 
}

因爲它是在初始化函數，我知道它是在應用程序啓動時調用。但是我的代碼沒有進入到onPanelRendered方法中，所以我認爲'viewport> panel'條件失敗了，但是我想知道它到底做了什麼以及可以使用哪些其他選項。

在此先感謝

來源

2014-08-28 user777777

我覺得'視口>面板'有一個CSS選擇器。參考http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.app.EventBus-method-control – Sreek521 2014-08-28 12:13:12

的ExtJS自帶的單頁Web應用程序的類別下（一般來說，這些項目將只有切入點）。這些單頁網頁應用程序控制瀏覽器的可見區域，這個區域在ExtJS中被稱爲「視口」。 ExtJS4開始從視口渲染應用程序。它是一個擴展容器。您可以查看適用於視口here的文檔和配置參數。

文件說

視口使自身到文檔正文，並自動調整大小本身到瀏覽器窗口的大小並管理窗口大小調整。可能只有一個Viewport在頁面中創建。 Blockquote

這就是所有關於視口。

回到第二個問題「什麼時候會被叫？」。當ExtJS應用程序準備就緒時，它會搜索viewport.js並開始在body上渲染它。這意味着只要您的應用程序準備就緒，它就會被調用。

最後讓我們看看控制器中視口的用法。

'viewport > panel' : { 
     render : this.onPanelRendered 
    }

在這裏，您打電話給dom查詢以獲取面板事件。上面的聲明說，轉到視口項目的第一個面板並執行渲染事件。在這種情況下，只要panel得到渲染，就會調用this.onPanelRendered。

可能出現的問題可能是

「onPanelRendered」是不是可以在控制器的範圍
視可能沒有面板
如果視口具有面板，其「渲染」活動可能已經被覆蓋
應用程序配置可能不正確

您仍然無法弄清楚，發佈完整的代碼和錯誤，如果有的話。

來源

2014-08-28 17:16:06 Bala

感謝很好的解釋。我現在明白了。 – user777777 2014-09-02 13:56:27

我有一個關於這個問題..在條件'視口>面板'視口引用類名右？如果我想在容器或用戶定義的類中找到面板，該怎麼辦？我能做到嗎？ – user777777 2014-09-02 14:00:06

你可以試試這個viewport> panel [cls = my-cls]，這裏面板只是一個xtype，你可以給用戶定義的xtype而不是panel。您也可以應用邏輯操作（如'和'，'或'），您還可以通過組件的屬性（如collapsible = true，cls = ..）查找。有關更多選項，請查看：http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.ComponentQuery – Bala 2014-09-02 15:58:18

extjs中的視口是應用程序呈現的整個瀏覽器窗口。 viewport > panel不是一個條件。您只需使用CSS選擇器在視口內查找任何面板，並使用onPanelRendered方法連接渲染事件。

來源

2014-08-29 20:21:59

什麼是extjs4中的視口面板

回答

相關問題