我已经组装了一个大小适中的应用程序,并且正在分解代码以减少维护行的总数以及性能调整。让我发布此问题的用例是,我在菜单中嵌入了一个按钮,该按钮调用(或需要调用)显示表单的控制器上的方法。目前这是使用对特定按钮控件的直接引用、创建面板并将该面板放在我的视口中来实现的。
问题在:ExtJS 4.1 Call One Controller From another开始解决响应结束时的最佳实践问题,但并没有真正解决可以复制或扩展以涵盖更复杂实现的基本案例(其中是我的问题的目的。)
给定两个控制器:
一个“主菜单”控制器。
// controller/Menu.js
Ext.define("App.controller.Menu", {
extend: "Ext.app.Controller",
init: function () {
this.control({
"viewport > mainmenu > button": function (ctl, evt) {
}
});
}
});
用户帐户控制器
// controller/User.js
Ext.define("App.controller.User", {
extend: "Ext.app.Controller",
stores: ["User"],
views: ["user.Edit", "user.List"],
init: function () {
}
});
问题
在两个控制器之间实现交叉连接以正确委派响应“创建新帐户”菜单按钮上的单击事件的责任的(最佳)方法是什么?
一种可能的解决方案
使用 componentquery,我可以使用标记属性轻松缩小主菜单视图中按钮的焦点,以便用户控制器直接响应事件:
// controller/User.js
"viewport > mainmenu > button [tag=user.create]": function () {}
未知的替代品
或者我可以通过对象图筛选我的方式来从菜单控制器中找到对用户控制器的引用并以这种方式调用它。
// controller/Menu.js
// switch on tag case "user.create"
App.controller.User.createUserForm()
真正的问题
所有这些导致的问题是这里“最可接受”的解决方案是什么。可以想象使用第三个中介控制器将请求从控件“路由”到控制器,但我认为这与框架的其余部分试图做的事情背道而驰。使用这两种方法中的任何一种的变体目前都有效,但是感觉都不是完全干净和可靠的;或最终可长期维护(因为代码传播得相当快。)此外,我们想到要进入原始事件,但我们在那里遇到了同样的可维护性问题。