ExtJS5 TypeError: Ext.ux.ProgressBarPager не является конструктором

Question

Я пытаюсь создать сетку с индикатором выполнения в проекте MVVM. Он используется для работы, но когда я был освежить приложение с

sencha app refresh 

я начал получать «TypeError: Ext.ux.ProgressBarPager не конструктор» ошибка.

Это панель, я использовал мою сетку в нем:

Ext.define("GeoPortal.view.south.South",{ 
    "extend": "GeoPortal.geox.components.Panel", 
    "controller": "south", 
    "viewModel": { 
     "type": "south" 
    }, 
    "region": 'south', 
    "collapsible": true, 
    "collapsed": true, 
    "title": "SouthPanel", 
    "xtype": "southPanel", 
    "items": [{ 
     xtype: 'gxPagedGrid', 
     params: { 
      store: 'GeoPortal.store.Companies', 
      pageSize: 5, 
      columns: [{ 
       text: 'Name', 
       sortable: true, 
       dataIndex: 'name', 
       flex: 1 
      }, { 
       text: 'Price', 
       sortable: true, 
       formatter: 'usMoney', 
       dataIndex: 'price', 
       width: 75 
      }, { 
       text: 'Change', 
       sortable: true, 
       dataIndex: 'change', 
       width: 80 
      }, { 
       text: '% Change', 
       sortable: true, 
       dataIndex: 'pctChange', 
       width: 100 
      }] 
     } 
    }] 
}); 

И это мой pagedGrid класс:

Ext.define('GeoPortal.geox.components.PagedGrid', { 
    extend: 'GeoPortal.geox.components.Grid', 
    xtype: 'gxPagedGrid', 
    using: [ 
     'Ext.toolbar.Paging', 
     'Ext.ux.ProgressBarPager' 
    ], 

    initComponent: function() { 

     var store = new Ext.create(this.params.store, { 
      pageSize: this.params.pageSize, 
      proxy: { 
       enablePaging: true 
      } 
     }); 

     Ext.apply(this, { 
      using: store, 
      store: store, 
      columns: this.params.columns, 
      bbar: { 
       xtype: 'pagingtoolbar', 
       pageSize: this.params.pageSize, 
       store: store, 
       displayInfo: true 
       // FIX: this 
       //plugins: new Ext.ux.ProgressBarPager() 
      } 
     }); 
     this.callParent(); 
    }, 

    afterRender: function() { 
     this.callParent(arguments); 
     this.getStore().load(); 
    } 
}); 

Спасибо заранее.

Answer 1

Возможно, проблема возникает из-за того, что вы используете using вместо requires в определении класса. Поэтому при попытке создать экземпляр Ext.ux.ProgressBarPager не загружается.

Ext.create('Ext.ux.ProgressBarPager') работает (как указано в статье), потому что он способен нагружать класс по требованию, поэтому лучше использовать Ext.create за new.