ExtJS4：具有关联和存储的模型 介绍

我在ExtJS中的

Ext.data.Model

类中遇到了一个应用程序设计问题。我将尝试将我的想法发展到一个非常常见的在线商店场景，这样您就可以跟随我了。如果您能对我的想法和结论发表意见，我将不胜感激

模型 假设您希望将“每个客户都可以订购多个产品”这一事实映射到ExtJS。从简单的文字中，我们可以识别出这三种涉及的模式：

客户

、

订单

、以及

产品

。在这种情况下，

订单

是连接

客户

和

产品

s

联想 我发现ExtJS实际上允许您使用

Ext.data.HasManyAssociation

和

Ext.data.BelongsToAssociation

类指定这个

（客户）1-n（订单）1-n（产品）

关系。但这是一个人想要的吗？您是否希望

产品

始终属于

订单

？如果您想要一个

产品

s的列表，而与

订单

s没有任何连接，该怎么办

商店 这就是它变得更加具体的地方。在ExtJS中，您有

Ext.data.Store

s来保存所有数据。对我来说，组织数据的一种自然方式是为我的每个模型设置一个

Ext.data.Store

：

CustomerStore

OrderStore

ProductStore

考虑将三个

Ext.grid.Panel

s并排放置；每个商店一个。在一个网格中选择客户时，他的订单会自动显示在第二个网格中。在第二个网格中选择订单时，关联的产品将显示在第三个网格中

你觉得这很自然吗？如果没有，请评论

把这一切结合起来 现在我们有三件事需要结合起来：

模型及其应用

关联（

有许多

，

属于

）和

数据（

Store

s）

是否可以仅从模型关系的一侧定义关联？例如，我是否可以指定一个

订单

有许多
产品
，但不包括
产品
属于
订单
？因为一个
产品
实际上可以属于多个
订单
。因此，我指定
产品
型号
有许多订单
如下

以下是ExtJS中的模型：

顾客
Ext.define（'Customer'）{
扩展：“Ext.data.Model”，
要求：[
“命令”，
],
字段：[
{name:'id'，type:'int'}，
{name:'lastname'，键入：'string'}
{name:'firstname'，键入：'string'}
],
hasMany:'Order'/*在每个客户实例上生成orders（）方法*/
});

命令
Ext.define（'Order'）{
扩展：“Ext.data.Model”，
字段：[
{name:'id'，type:'int'}，
{name:'customer_id'，type:'int'}，/*指此订单所属的客户*/
{name:'date'，键入：'date'}
],
belongsTo:'Customer'，/*在每个订单实例上生成一个getCustomer方法*/
hasMany:'Product'/*在每个订单实例上生成一个products（）方法*/
});

产品
Ext.define（'Product'）{
扩展：“Ext.data.Model”，
字段：[
{name:'id'，type:'int'}，
{name:'name'，type:'string'}，
{name:'description'，type:'string'}，
{name:'price'，键入：'float'}
],
/*
这里我没有指定与“订单”模型的关系
因为它根本不属于这里。
它还能用吗？
*/
有很多：“订单”
});

以下是商店：

顾客商店
Ext.define（'CustomerStore'{
扩展：“Ext.data.Store”，
storeId:“CustomerStore”，
型号：“客户”，
代理：{
键入：“ajax”，
url:'data/customers.json'，
读者：{
键入：“json”，
root:'项目'，
totalProperty:'total'
}
}
});

订单库
Ext.define（'OrderStore'{
扩展：“Ext.data.Store”，
storeId:'OrderStore'，
型号：“订单”，
代理：{
键入：“ajax”，
url:'data/orders.json'，
读者：{
键入：“json”，
root:'项目'，
totalProperty:'total'
}
}
});

产品商店
Ext.define（'ProductStore'{
扩展：“Ext.data.Store”，
storeId:'ProductStore'，
型号：'产品'，
代理：{
键入：“ajax”，
url:'data/products.json'，
读者：{
键入：“json”，
root:'项目'，
totalProperty:'total'
}
}
});

这里有一个关于公司及其产品的例子（不是我举的）。它使用两个模型和两个存储，但没有定义关联

先谢谢你

-康拉德。我最近面临着处理
模型+关联+商店的问题
。这不是很愉快的经历。以下是我学到的：

假设我们有Store1，Store2，Model1，Model2，Grid1，Grid2。Grid1使用Store1，Store1使用Model1，同样，Grid2使用Store2，Store2使用Model2

到目前为止，一切正常，数据正在加载等等

但是现在我们想将
hasMany
关联添加到Model1。好的，我们将添加到Model1的配置中：

hasMany: {model: 'Model2', name: 'model2'}

store: new Model1().model2(),

在此之后，您认为可以通过执行以下操作，使用Grid1的
项Click
上的数据填充Store2：

Grid1.on('itemclick', function(view, item_which_uses_model1){
  //item_which_uses_model1.model2() supposed to return Model2's store
  item_which_uses_model1.model2().load();
}

您希望Grid2中填充Grid1上的数据