Sencha Touch MVC 最佳实践

Posted 2023-02-26

【中文标题】Sencha Touch MVC 最佳实践

【英文标题】：Sencha Touch MVC Best Practices

【发布时间】：2011-06-11 18:04:20

【问题描述】：

我正在尝试围绕 Sencha Touch 的 MVC 框架进行思考，但我发现了几种不同的方法。其中一个发现here，有一种构建Sencha Touch 应用程序的方法在SenchaCon 2010 上展示。它增加了Sencha Touch 员工的重量，但它已经有几个月的历史了。在 Sencha Touch MVC 上其他更近期的帖子中，他们有教程（例如 here，以及 Jay Garcia 的 Manning 的 MEAP Sencha In Action）似乎依赖于 Ext.Dispatch视图调用特定的控制器方法，将附加元素传递给控制器​​，这使视图具有控制器意识。

我的问题是，构建 Sench Touch MVC 应用程序的最佳实践是什么？

【参考方案1】：

我也有类似的问题。 Sencha 为您的视图组件实例自动创建大量 getter。这很混乱。

我以 Sencha Touch 2.0 和一个完整的 MVC 脚手架应用程序为例。我将它基于 ExtJS 4.0 MVC 架构。这将在 Sencha Touch 2.0 开发者预览版中开箱即用，并且可以为您节省大量时间。

https://github.com/FrancisShanahan/SenchaTouch2MVCHelloworld

为了回答您的具体问题，最新的 ExtJS 4.0 MVC 架构在控制器的 init 事件中设置了对视图组件实例的侦听器。这是从已经链接的 github 项目中获取的示例：

Ext.define('HelloWorld.controller.Home', 
    extend: 'Ext.app.Controller',   
    views: ['Home', 'SimpleList'],
    .. etc... 
    init: function() 
        // Start listening for events on views
        this.control(
                 // example of listening to *all* button taps
                 'button':  'tap': function () 
            console.log('Every button says Hello world');
         
    ...

如果有帮助，请告诉我， 问候， -fs

【讨论】：

请注意，这已在 sencha2-rc2（2012 年 2 月）中被弃用。如果您在控制器中声明视图，您会收到一条警告，提示您应该在 App 文件中声明所有视图。

谢谢，widged；我喜欢到目前为止在 Sencha 2 中看到的内容。

【参考方案2】：

我建议让您的控制器具有视图感知功能。当控制器接收到调度事件时，您应该有类似以下的内容：

this.controllerViewOne = this.controllerViewOne
                         || this.render(
                                 xtype: 'panel',
                                 listeners: 
                                      onMajorUIAction : function(params)
                                           Ext.Dispatch( 
                                                controller : 'ProperController',
                                                action     : 'ProperAction',
                                                historyUrl : 'ProperHistoryUrl',
                                                params : params
                                           );
                                      
                                 
                            );

这还有一个额外的好处，就是将每个控制器视图的所有“主要”侦听器都放在一个空间中。这也意味着重用其他控制器的视图变得更加容易。

您的视图都应该有侦听器，帮助抽象各个组件及其事件/侦听器的复杂性。

我使用 UI 管理器进行全局 UI 更改，例如隐藏/显示主工具栏或显示后退按钮。

【讨论】：

只要您确保将应用程序分解为多个控制器，就不会导致控制器过多。

感谢您的信息。我同意让控制器具有视图感知能力，因为它们正在监听事件是很有意义的。我还听说如果 Touch 跟随 Ext JS，Ext.dispatch() 可能会消失：link