EXTJS 4 嵌套 json 数组数据到网格面板

Question

我是 ExtJS 的新手，但无论如何我都找不到用简单的 JSON 字符串数组填充我的网格。我的 JSON 如下所示：

{
 ...stuff...
 "users": ["kevin","ryan", "david", "mark", "ed"]
 ...more stuff...
}

我想用这个用户列表填充一个简单的单列网格，但似乎找不到任何方法！ :(

我的代码如下所示：

  Ext.define('usersModel', {
      extend: 'Ext.data.Model',
      fields: [{ name: 'users', type: 'auto'}]
  });

  var usersStore = Ext.create('Ext.data.Store', {
      model: 'usersModel',
      proxy: {
          type: 'ajax',
          url : '/users',
          reader: 'json'
      },
      autoLoad: true
  });

  // create the Grid
  Ext.create('Ext.grid.Panel', {
      store: usersStore,
      columns: [{
          dataIndex: 'users',
          width: 500,
          text: 'User'
      },
      ],
  });

但它只是在一个单元格中显示逗号分隔的用户列表。我知道为什么会这样，我将列的 dataIndex 设置为数组，而不是数组中的元素，但不知道如何修复它。

Answer 1

试试这个：

  Ext.define('usersModel', {
      extend: 'Ext.data.Model',
      fields: [{ name: 'name', type: 'auto'}]
  });

  var usersStore = Ext.create('Ext.data.Store', {
      model: 'usersModel',
      proxy: {
          type: 'ajax',
          url : '/users',
          reader: {
              type: 'json',
              rootProperty: 'users'
          }
      },
      autoLoad: true
  });

  // create the Grid
  Ext.create('Ext.grid.Panel', {
      store: usersStore,
      columns: [{
          dataIndex: 'name',
          width: 500,
          text: 'User'
      },
      ],
  });