深入理解Extjs4 MVC架构：下篇

"这篇文章除了介绍EXTJS4 MVC架构的应用，还涉及到组件查询、事件监听、控制器操作以及视图窗口的创建。" EXTJS4的MVC架构是为了解决大型客户端应用的组织和维护问题而设计的。在EXTJS4中，MVC模型包括模型（Model）、视图（View）、控制器（Controller）和存储（Store）四个主要部分，它们协同工作以实现应用的逻辑分离和模块化。 1. **模型（Model）**: 模型用于封装数据和业务逻辑，它可以与后台服务进行交互，负责数据的获取和更新。在EXTJS4中，你可以定义模型类，包含字段定义和验证规则。 2. **视图（View）**: 视图是用户界面的呈现，它们通常由各种组件（如Grid, Form, Panel等）组成。视图负责显示和获取用户界面的数据，并可以绑定到模型或控制器。 3. **控制器（Controller）**: 控制器作为视图和模型之间的桥梁，它监听视图中的事件并做出响应，同时也可以调用模型和视图的方法来改变应用的状态。例如，在文章中，`AM.controller.Users`定义了一个控制器，它监听用户列表（userlist）的双击事件，并触发编辑用户的功能。 4. **存储（Store）**: 存储负责管理一组数据，它可以是从服务器加载的，也可以是本地数据。Store与模型关联，当数据发生变化时，会自动更新关联的视图。 在文章的示例中，控制器使用`control`方法来指定组件查询（Component Query）和相应的事件处理。`'userlist'`是一个组件查询，匹配具有'viewport>panel'配置的grid。`itemdblclick`事件监听器绑定了`editUser`方法，当用户双击网格中的行时，该方法会被调用。`editUser`方法则在控制台打印出被双击的用户名称。 为了实现用户编辑功能，文章还展示了创建一个编辑窗口的过程。`AM.view.user.Edit`定义了一个窗口组件，它包含一个表单字段，用于编辑用户的姓名。窗口自动显示，采用适应布局（fit layout），确保内容完全填充窗口。 通过这种方式，EXTJS4的MVC架构使得开发者能够将应用的不同部分清晰地划分，提高了代码的可读性和可维护性。开发者可以专注于每个部分的功能，而不用担心其他部分的干扰，从而实现更高效、更稳定的开发。