Question

以下场景的最佳实践或设计方法是什么：

从服务器返回了一个json，其中包含有关人员及其地址的信息
我需要显示一个表格，其中包含该人的一般信息以及包含每个地址的列表。
在此列表中，每个地址都必须是列表中的项目，因为为了执行其他操作，它将是多选真。

我所做的是：

a）使用与“Direccion”（西班牙语为地址）的hasMany关系定义模型“Persona”，我的代理在模型中

b）定义模型“Direccion”

c）定义一个列表并尝试使用itemTpl配置来显示每个itemList的1个地址，但到目前为止我只能在同一个itemList中显示给定人物的所有地址。 有没有办法实现这一目标？

根据这种情况，这种做法是否合适？

我试图只做一个请求，并且只有一个商店来填写这2个组件，但现在我对它有疑问。

那么在这种情况下最好的设计/实践是什么？

JSON响应

{
    "personas": [
        {
            "id": 1,
            "nombre": "jon",
            "apellido": "caballero",
            "direcciones": [
                {
                    "direccionId": 1,
                    "calle": "fco villa",
                    "colonia": "barona"
                },
                {
                    "direccionId": 2,
                    "calle": "duraznos",
                    "colonia": "canutillo"
                }
            ]
        }
    ]
}

模型

Ext.define('Associations.model.Direccion', {
    extend: 'Ext.data.Model',

    config: {
        idProperty: 'direccionId',
        fields: [
            { name: 'calle', type: 'auto' },
            { name: 'colonia', type: 'auto' }
        ]
    }
});




Ext.define('Associations.model.Persona', {
    extend: 'Ext.data.Model',
    requires: ['Associations.model.Direccion'],
    config: {
        fields: [
        { name: 'nombre', type: 'auto' },
        { name: 'apellido', type: 'auto' },
        ],
        hasMany:[
        {
            foreignKey: 'direccionId',
            associationKey: 'direcciones',
            name: 'direcciones',
            model: 'Associations.model.Direccion'
        }

        ],
        proxy: {

            type:'ajax',
            url: 'data/respuesta.json',
            reader: {
                type:'json',
                rootProperty:'personas'
            }
        }
    }
});

商品

Ext.define('Associations.store.Persona', {
    extend: 'Ext.data.Store',
    requires: [
        'Associations.model.Persona'
    ],
    config: {
        model: 'Associations.model.Persona',
        autoLoad: true
    }
});

列表

Ext.define('Associations.view.PersonaList', {
    extend: 'Ext.List',
    xtype: 'personalist',
    config: {
        onItemDisclosure: true,
        emptyText: 'No se encontraron personas',
        store: 'Persona',
        padding: 10,
        margin: 10,
        itemTpl : [
         '<tpl for="direcciones">',
                    '<li>Colonia {colonia}</li>',
                    '<li>Calle {calle}</li>',
         '</tpl>',  
        ].join('')
    }

});

有什么想法吗？提前谢谢。

Answer 1

当你做model.load（）并且模型与另一个模型有一个hasMany关系时，子对象的存储是自动生成的，因此最好的方法是加载模型获取子记录的存储并将其设置为列表。

具有关联的模型，1个请求填充2个组件的最佳实践

1 个答案: