使用 Sencha Touch 2 从 JSON API 加载单个记录

Question

我很难理解 Sencha Touch 2 的架构。我发现即使是我在其他语言和框架中做的最基本的事情也非常痛苦。

目前，我只想做一个标准的主/详细视图。我将商店加载到列表视图中，并希望单击每个列表项以在详细视图中滑动。由于我的初始列表视图可以包含相当多的项目，因此我只在控制器中使用此方法加载了一小部分数据：

viewUserCommand: function(list, record) {
      // console.log(record);
      var profileStore = Ext.getStore("Profiles");
      profileStore.setProxy({
        url: 'http://localhost:8000/profile/' + record.data.user_id
      });
      profileStore.load();

      // console.log(profileStore);

      Ext.Viewport.animateActiveItem(Ext.getCmp('profileview'), this.slideLeftTransition);

    }

首先，修改每个点击事件的 url 属性似乎有点 hacky。有没有办法指定“this.id”或类似的东西，然后将它传递给我的商店？还是需要将整个数据库表加载到一个对象中？

我可以 console.log 从这个方法返回，这正是我想要的。如何填充详细视图？我试过使用 DataView 组件，但它没有显示任何数据。 sencha 网站上的示例相当稀少，而且相对没有上下文。这意味着即使复制和粘贴他们的示例也可能会失败。 （我尝试使用 Ext.modelMgr.getModel() 的任何示例都失败了。）

我知道部分原因是这个框架是新的，我可能在理解它时遗漏了一个巨大的漏洞，但有人知道吗？

Answer 1

建议您查看文档，有一个加载单个模型的示例：

http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Model

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

    config: {
        fields: ['id', 'name', 'email'],
        proxy: {
            type: 'rest',
            url : '/users'
        }
    }
});

//get a reference to the User model class
var User = Ext.ModelManager.getModel('User');

//Uses the configured RestProxy to make a GET request to /users/123
User.load(123, {
    success: function(user) {
        console.log(user.getId()); //logs 123
    }
});