使用extjs在ViewModels之间传递数据参数

假设我们有1个父视图模型（对应于视口）和2个嵌套（网格和窗口）视图模型。在grid actioncolumn上，单击我们获得一个记录id，将其作为ajax请求url部分传递，并将响应显示在窗口文本字段中。如果响应中没有显示值，则显示默认值

有趣的部分是，如何使用viewmodel绑定将响应数据传递给窗口文本字段。我提出了以下解决方案：

1） 根据ajax请求，使用将通过模型传递的响应数据创建网格viewmodel链接，必要时创建默认值：

grid.getViewModel().linkTo('custom', {
    reference: 'CustomModel',
    create: data
});

Ext.define('CustomModel', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'name', defaultValue: 'default name' },
        { name: 'value', defaultValue: 'default value' }
    ]
});

2） 使用栅格viewmodel中的公式将数据发布到父viewmodel：

formulas: {
    publishCustom: function(get) {
        this.set('main.custom', get('custom'));
    }
}

3） 使用父（视口）viewmodel中的数据填充窗口文本字段

bind: '{main.custom.name}'

你可以找到小提琴

---

这似乎有点不明显，并严重地创建了一个额外的数据拷贝。对于这样的问题，有没有更干净的解决方案？

更干净的方法是只在顶层主视图模型中存储常用的对象，因为所有子VM都继承父VM中的数据对象

您仍然可以绑定到它们或在公式中使用，就像它们在子VM中一样。 见：

---

为什么网格或窗口有一个viewmodel？请求似乎属于父容器级别，因为它对网格和窗口都有影响。这只是一个简化的示例，没有一组用于嵌套视图模型的公式。当一个父视图模型中有数千行代码时，阅读和维护就有点困难。就我们使用MVC或MVVM模式而言，在它自己的viewmodel中使用这种逻辑似乎是合适的。我的意思是，似乎不应该在网格级别上负责加载，因为这段信息需要与其他组件进行通信。这种行为似乎应该在控制窗口/网格的容器级别进行控制。目前的做法并不是正确使用公式。控制网格和窗口行为的唯一容器是一个视口，它有几十个网格/窗口/任何捆绑包，其中包含数百个公式和存储，加载到单个树面板项目单击中。因此，Sencha建议将所有这些员工保持在一个顶级视图模型中？我建议将您的体系结构拆分为可管理的部分。孤立地谈论这些部分，它们似乎是相关的，应该有一些中央管理者。中央经理不必包罗万象。如果您有一个包含“上百个公式和存储”的容器，这可能表明您的体系结构中的责任划分存在问题。