2

我正在尝试使用新的 ExtJs 5。我根据 ExtJs5 的定义 MVC 模式创建了一个小应用程序。

我正在使用ViewControllers每个View.

问题陈述：现在假设我有两个 VC（Controller1 和 Controller2）。每个都有自己的方法。我希望从 Controller1 调用 Controller2 的方法。我想从 Controller1 更新与 Controller2 关联的视图。

E.g. Suppose there is a separate view for Status Bar and a ViewController(StatusBarController). 
This VC has a method to update the view based on whatever message it receives as input parameter. 
All the other controllers in the application will call this VCs method to update the status of the application on the status bar.

在以前的版本中，this.getController('StatusBarController')用于获取任何控制器的句柄，然后调用其方法。

但是当我使用 ViewController 时，这在我的情况下不起作用。

谁能指导我如何实现这一目标？还有这是否是做这件事的正确/理想方式，还是有更好的选择？

这是我的代码：

状态栏视图：

Ext.define('MyApp.view.statusbar.StatusBarView', {
extend : 'Ext.panel.Panel',
controller: 'StatusBarController',
region : 'south',
xtype : 'status-bar-panel',
html : 'This is a status bar'
});

状态栏控制器：

Ext.define('MyApp.controller.StatusBarController', {
extend : 'Ext.app.ViewController',
alias: 'controller.StatusBarController',
updateStatusBar : function(message) {
    this.getStatusBarView().update(message);
}   
});

应用程序中的其他一些控制器：

Ext.define('MyApp.controller.ResourcesPanelController', {
extend : 'Ext.app.ViewController',
alias : 'controller.ResourcesController',
onItemClick : function(tree, record, item, index, e, eOpts) {
            // here I am calling the other controller's method.
    this.getController('StatusBarController').updateStatusBar(
            record.data.text + ' has been clicked');
}
});
4

2 回答 2

8

ViewControllers 与它们的视图紧密相关，它们甚至与视图一起创建和销毁，它们应该只控制自己的视图。这个想法是在视图级别将逻辑与 UI 分开。

从另一个 ViewController 调用方法不是一个好习惯，而且对于大型应用程序来说，这是通往地狱的道路，因为它不可避免地会导致无法维护的意大利面条式代码。

正确的做法是尽量减少 ViewModel、ViewController 和 Controller 的数量，让它们在各自的职责范围内工作。

例如：假设您想要一个容器中的网格和表单。表单将允许编辑在网格中选择的记录。加上一些按钮。这三个视图（容器、网格和表单）共同构成一个单元。因此：

  1. 容器只需要一个ViewController，所有视图都可以使用
  2. 容器中只需要一个 ViewModel，所有视图都可以使用
  3. 如果你想让这三者与应用程序的其余部分的外部世界进行通信，容器的视图控制器可以触发事件并且可以有 API 方法来调用

因此，如果需要，您可以拥有一个 MVC（全局）控制器来协调单元的功能，就像我们的三重奏一样。

此外，数据绑定在很大程度上简化了逻辑，因此不需要那么多控制器和侦听器。

请参阅ExtJS 5示例中的 Binding Grid 和 Form。

于 2014-06-16T07:03:27.210 回答
0

my answer is simple and short: Ext.app.ViewController.fireEvent()

while one can add any type of custom event with the listeners config of the ViewController - the docs of the listen config state "event domains", so I'd assume, that both controller need to reside within the same domain in order to be able to interact, event-wise.

the 2nd argument of .fireEvent() might need to imitate the element which ordinary triggers the event.

well, it should also be possible to access it like that (in the secondary controller):

this.getApplication().getStatusBarController().updateStatusBar('...');
于 2014-07-10T03:44:39.543 回答