Sencha touch 在Sencha Touch中加载关联数据而不嵌套

我正在开发一个基本的Sencha Touch应用程序，它显示文本消息列表和发送消息的相关用户的姓名。我已经在线学习了有关如何设置模型关联的教程，但每个教程都假设服务器生成具有嵌套结构的数据

我正在处理的数据有一个带有主键/外键关系的平面结构，我无法理解如何让Sencha从一个响应中加载两个存储

model/User.js

Ext.define('App.model.User', {
    extend: 'Ext.data.Model',

    config: {
        fields: [
            { name: 'uid', type: 'number' },
            { name: 'name', type: 'string' },
        ]
    }
});

store/Users.js

Ext.define('App.store.Users', { 
    extend: 'Ext.data.Store',                                                    

    config: {                                                                    
        model: 'App.model.User',                                                 
        autoLoad: true,
    }
});

model/Message.js

Ext.define('App.model.Message', {
    extend: 'Ext.data.Model',

    config: {
        fields: [
            { name: 'id', type: 'number' },
            { name: 'uid', type: 'number' },
            { name: 'message', type: 'string' }
        ],

        associations: [{
            type: 'belongsTo',
            model: 'App.model.User',
            primaryKey: 'uid',
            foreignKey: 'uid'
        }],

        proxy: {
            type: 'jsonp',
            url: 'messages.json',

            reader: {
                type: 'json',
                rootProperty: 'req_messages'
            }
        }
    }
});

store/Messages.js

Ext.define('App.store.Messages', {
    extend: 'Ext.data.Store',

    config: {
        model: 'App.model.Message',
        autoLoad: true,
    }
});

我的应用程序正确地加载和显示了这些消息（下面是JSON响应示例），但我不知道如何将相关用户加载到存储中。这可以通过配置来解决，还是我需要一个定制的阅读器？感谢您的帮助

示例JSON

{
    "users": [{
        "uid": "1",
        "name": "John"
    }, {
        "uid": "3033",
        "name": "Noah"
    }],
    "req_messages": [{
        "id": "539",
        "uid": "1",
        "message": "my message"
    }, {
        "id": "538",
        "uid": "1",
        "message": "whoops"
    }, {
        "id": "534",
        "uid": "3033",
        "message": "I love pandas."
    }]
}

---

我从来没有真正与协会打过交道，我仔细阅读了文档，试图找到一些可以根据请求加载两个商店的内容，但我找不到任何内容。下面是我将如何做到这一点：

型号

Ext.define('App.model.User', {
    extend: 'Ext.data.Model',

    config: {
        fields: [
            'uid',
            'name'
        ]
    }
});

Ext.define('App.model.Message', {
    extend: 'Ext.data.Model',

    config: {
        fields: [
            'id',
            'message',
            'uid'
        ],
        associations: { type: 'hasOne', model: 'User', primaryKey: 'uid', foreignKey: 'uid'}
    }
});

商店

Ext.define('App.store.Users', { 
    extend: 'Ext.data.Store',                                                    

    config: {                                                                    
        model: 'App.model.User',
        autoLoad: true,

        proxy: {
            type: 'ajax',
            url: 'http://www.titouanvanbelle.fr/test.json',

            reader: {
                type: 'json',
                rootProperty: 'users'
            }
        },

        listeners:{
          load:function(s,r,success,op){
            var msgs = JSON.parse(op.getResponse().responseText).req_messages;
            Ext.each(msgs, function(msg) {
                Ext.getStore('Messages').add(Ext.create('App.model.Message',msg));
            });
          }
        }
    }
});

Ext.define('App.store.Messages', {
    extend: 'Ext.data.Store',

    config: {
        model: 'App.model.Message'
    }
});

列表

Ext.define("App.view.Main", {
  extend: 'Ext.Panel',

  config: {
    fullscreen: true,
    layout:'fit',
    items: [{
      xtype:'list',
      store:'Messages',
      itemTpl: new Ext.XTemplate(
          '<tpl for=".">',
            '{[this.getUserName(values)]} : {message}',
          '</tpl>',
          {
            getUserName(v){
              var s = Ext.getStore('Users'),
                  u = s.getAt(s.find('uid',v.uid));
              return u.get('name');
            }
          }
      )
    }]
  }
});

Ext.define（“App.view.Main”{
扩展：“Ext.Panel”，
配置：{
全屏：对，
布局：'适合'，
项目：[{
xtype:“列表”，
存储：'Messages'，
itemTpl:new Ext.XTemplate(
'',
“{[this.getUserName（values）]}:{message}”，
'',
{
getUserName（v）{
var s=Ext.getStore（'Users'），
u=s.getAt（s.find（'uid'，v.uid））；
返回u.get（'name'）；
}
}
)
}]
}
});

你会得到这样的结果：

---

希望这有帮助。如果您需要解释，请告诉我。

我想要一个解决方案，这样在视图中我就不必自己进行交叉引用。为什么关联不足以实现更简单的视图？