Question

我使用的是由面向MVC的代码风格驱动的Extjs5.1 我有一个主视图，它继承自Ext.panel.Panel并带有边框布局。

在东部地区，有一个包含多个记录的商店的网格（或者＃34;型号＆＃34;，我真的不知道我应该在这里使用什么术语）。（＆＃34;主网格＆＃34;）
在中心区域，有另一个视图继承自Ext.form.Panel，它应该显示网格的选定项目。（＆＃34;奴隶形式＆＃34;）

我的目标是刷新＆＃34;奴隶形式＆＃34;使用＆＃34;主网格的选定记录＆＃34;。

我发现＆＃34;沟通的唯一方式＆＃34;网格和表单之间是从主视图控制器执行fireEvent（＆＃39; selectRecord＆＃39;，...）并在表单视图控制器内监听他，但它看起来很奇怪，因为表单视图是主视图的子项。

有更常见的方法吗？

通过改进，直接调用另一个视图的函数是一个很好的做法，还是应该让它们各自的控制器进行交互？

Answer 1

我通常做的并且我认为最常见的方法就是拥有一个selectionchange事件监听器，它会像这样更新你的表单：

listeners : {
    selectionchange: function(model, records) {
        var rec = records[0];
        if (rec) {
            formpanel.getForm().loadRecord(rec);
        }
    }
}

要使其生效，表单字段的name属性必须与网格存储模型中字段的名称匹配。

这里有一个例子：http://dev.sencha.com/extjs/5.1.0/examples/kitchensink/#form-grid

Extjs 5 MVC中的主/从面板

1 个答案: