我已经组装了一个中等大小的应用程序,我正在分解代码以减少维护行的总数,并进行性能调优。当前这是通过使用对特定按钮控件的直接引用来实现的,创建一个面板,并将该面板放到我的视口中。
问题在: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 () {
}
});
问题
在两个控制器之间实现交叉连接以正确地委派响应“Create a New Account”菜单按钮上的单击事件的责任的(最佳)方式是什么?
一个可能的解决方案
使用componentquery,我可以 * 轻松 * 缩小主菜单视图中按钮的焦点,使用tag属性,以便User控制器直接响应事件:
// controller/User.js
"viewport > mainmenu > button [tag=user.create]": function () {}
未知的替代项
或者,我可以通过对象图来找到从Menu控制器到User控制器的引用,并以这种方式调用它。
// controller/Menu.js
// switch on tag case "user.create"
App.controller.User.createUserForm()
真实的的问题是
所有这一切产生的问题是什么是“最可接受的”解决方案。可以想象使用第三个中介控制器,将请求从控件“路由”到控制器,但我认为这与框架的其余部分试图做的相反。使用这些方法中的任何一种方法的变体目前都有效,但两者都感觉不完全干净和可靠;或者最终是长期可维护的(因为代码展开得相当快)。此外,我们曾经想到过直接处理原始事件,但是我们在那里遇到了同样的可维护性问题。
1条答案
按热度按时间lkaoscv71#
一些简短的台词:
我不明白的是 Sencha Touch有路由但没有事件总线,而ExtJS有事件总线但没有路由......(MVC实现还有很多不同之处)不管怎样,因为我大部分时间都在使用ExtJS,所以我创建了一个自定义路由来填补这个空白。也许Sencha会在版本5中添加这个。
***最简单、最快捷的解决方案:**使用
Ext.app.Application
控制器的getController()
从菜单控制器中调用负责的控制器。***(imo)最佳解决方案:**为自己编写一个路由器,其中每个控制器都注册其路由并使用这两个路由;如果你的应用程序有多个开发团队使用的共享组件,这会非常方便。