Extjs 4 - 结合两个网格列

Question

我有一个数据存储和一个网格。我正在尝试声明一个名为 FullName 的新列，它将结合两个数据索引。在花了一些时间研究这个问题后，我明白它可能是渲染器(网格级别)，也可能是数据存储中的自定义列(映射？)。

有人可以提供实现此类列的代码示例吗？

// XML
<person>
    <first_name>John</first_name>
    <last_name>Smith</last_name>
</person> 

// Store
Ext.create('Ext.data.Store', {
    autoLoad: true,
    storeId: 'TestStore',
    fields: ['first_name', 'last_name'],
    data: parsed_xml_object,
    proxy: {
        type: 'memory',
        reader: {
            type: 'xml',
            record: 'person'
        }
    }
});

// Grid
TestGrid = Ext.create('Ext.grid.Panel', {
    title: 'Test',
    store: Ext.data.StoreManager.lookup('TestStore'),
    columns: [
        { header: 'First Name', dataIndex: 'first_name' },
        { header: 'Last Name Name', dataIndex: 'last_name' },
     ],
    height: 200,
    autowidth: true
});

Answer 1

使用自定义渲染器:

{
   header: "Name",
   dataIndex: 'last_name',
   renderer: function(value, element, record) {
       return record.data['last_name'] + ', ' + record.data['first_name'];
   }
}