网格摘要渲染器未在 extjs 中显示

Question

谁能告诉什么是问题在网格视图摘要渲染器未显示 这是我的 app.js

Ext.application({
        requires : ['Ext.container.Viewport', 'TestGrid.view.GlobalTeamTable1'],
        name: 'TestGrid',
    views: ['GlobalTeamTable1'],
    models:['TestGrid.model.TestResult'],
    stores:['TestGrid.store.TestResultStore'],

  launch:function()
  {  

    Ext.create('Ext.container.Viewport', {
    layout : 'vbox',
     overflowY : 'scroll',
     items : [
             {
                xtype : 'globalteamtable1',
                width:1000,
                height :1000
              }

              ]



    });
  }

});

这是我的看法

Ext.define('TestGrid.view.GlobalTeamTable1', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.globalteamtable1',
    id:'gridid',
    store: Ext.create('TestGrid.store.TestResultStore'),
    columns: [{
        dataIndex: 'month',
        text: 'Month',
        summaryRenderer: function(){
            return '<b>Totals:</b>';
        }
    }, {
        dataIndex: 'target1',
        text: 'Target1',
        summaryType: 'sum'
    }, {
        dataIndex: 'target2',
        text: 'Target2',
        summaryType: 'sum'
    }, {
        dataIndex: 'targetDiff',
        text: 'Target(2-1)',
        summaryType: 'sum',

    }, {
        dataIndex: 'targetPercent',
        text: 'Target%',
        summaryType: function(records){
            var totals = records.reduce(function(sums, record){
                return [sums[0] + record.data.target2, 
                        sums[1] + record.data.targetDiff];
            }, [0,0]);

            return (totals[0] * totals[1]) / 100;
        }
    }]
});


    this is my model


Ext.define('TestGrid.model.TestResult', {
    extend: 'Ext.data.Model',
    fields: ['month', {
        name: 'target1',
        type: 'int'
    }, {
        name: 'target2',
        type: 'int'
    }, {
        name: 'targetDiff',
        type: 'int'
    }, {
        name: 'targetPercent',
        type: 'float'
    }]
});

这是我的店

Ext.define('TestGrid.store.TestResultStore', {
    extend : 'Ext.data.Store',
    storeId : 'testresult',
    model : 'TestGrid.model.TestResult',
    data: [{
            month: 'Jan',
            target1: 100,
            target2: 101,
            targetDiff: 1,
            targetPercent: 0.99
        },{
           month: 'Feb',
           target1: 110,
            target2: 112,
            targetDiff: 2,
            targetPercent: 0.99
        },{
            month: 'Mar',
            target1: 120,
            target2: 121,
            targetDiff: 1,
            targetPercent: 0.99
        },{
            month: 'Apr',
            target1: 130,
            target2: 133,
            targetDiff: 3,
            targetPercent: 0.99
        }]

});

谢谢

Answer 1

您需要将摘要功能添加到网格中：

Ext.define('TestGrid.view.GlobalTeamTable1', {
     extend: 'Ext.grid.Panel',
     features: [{
        ftype: 'summary'
     }],