Question

我的application.js文件定义如下。如您所见，有很多商店和视图需要加载。

问题是，它们是异步加载的。因此，如果用户在加载商店之前单击按钮，则无法使用。

如果我等到所有商店都已加载，它将按预期工作。

如何在需要时才加载商店;或者，这个问题有什么更好的解决方案？

Ext.define('RateManagement.Application', {
    name: 'RateManagement',

    extend: 'Ext.app.Application',

    views: [
        // TODO: add views here
        'RateManagement.view.Grids.CountryRateGrid',
        'RateManagement.view.Grids.LocationRateGrid',
        'RateManagement.view.ComboBox.CountryCombo',
        'RateManagement.view.ComboBox.CurrencyCombo',
        'RateManagement.view.ComboBox.LocationCombo',
        'RateManagement.view.ComboBox.RateTypeCombo',
        'RateManagement.view.Columns.CurrencyColumn',
        'RateManagement.view.Columns.RateTypeColumn',
        'RateManagement.view.Columns.LocationColumn',
        'RateManagement.view.Columns.RateTypeColumn',
        'RateManagement.view.Columns.CountryColumn',
        'RateManagement.view.ServiceSelect.ServiceSelect',
        'RateManagement.view.Grids.AirShipmentGrid',
        'RateManagement.view.Grids.LocationWithYearOtherRateGrid',
        'RateManagement.view.Grids.CountryWithYearOtherRateGrid',
        'RateManagement.view.Grids.RealtorFeeRateGrid',
        'RateManagement.view.Grids.AirfareRateGrid'
    ],

    controllers: [
        // TODO: add controllers here
    ],

    stores: [
        // TODO: add stores here
        'RateManagement.store.CountryStore',
        'RateManagement.store.CurrencyStore',
        'RateManagement.store.LocationStore',
        'RateManagement.store.RateTypeStore',
        'RateManagement.store.LegalRateStore',
        'RateManagement.store.DeparturePackageRateStore',
        'RateManagement.store.HouseSearchStore',
        'RateManagement.store.LanguageTrainingStore',
        'RateManagement.store.TempLiving1BedroomStore',
        'RateManagement.store.TempLiving2BedroomStore',
        'RateManagement.store.TempLiving3BedroomStore',
        'RateManagement.store.TransportationLuxury',
        'RateManagement.store.TransportationMidSize',
        'RateManagement.store.LanguageTrainingStore',
        'RateManagement.store.AirShipmentStore',
        'RateManagement.store.ServiceStore',
        'RateManagement.store.HomeSearchTripLodgingStore',
        'RateManagement.store.HomeSearchTripCarRentalStore',
        'RateManagement.store.HomeSearchTripMealsStore',
        'RateManagement.store.SchoolSearchStore',
        'RateManagement.store.RealtorFeeStore',
        'RateManagement.store.AirfareStore'
    ],

    models: [
        'RateManagement.model.Country',
        'RateManagement.model.Currency',
        'RateManagement.model.Location',
        'RateManagement.model.CountryRate',
        'RateManagement.model.LocationRate',
        'RateManagement.model.CountryRate',
        'RateManagement.model.Service',
        'RateManagement.model.AirShipmentModel',
        'RateManagement.model.RealtorFeeModel',
        'RateManagement.model.AirfareRate'
    ],

    launch: function() {
        //app launch code

        //stupid fix for stupid bug
        Ext.override(Ext.grid.RowEditor,{

          addFieldsForColumn: function(column, initial) {
            var me = this,
                i,
                length, field;


            if (Ext.isArray(column)) {
                for (i = 0, length = column.length; i < length; i++) {
                    me.addFieldsForColumn(column[i], initial);
                }
                return;
            }


            if (column.getEditor) {


              field = column.getEditor(null, {
                  xtype: 'displayfield',
                  getModelData: function() {
                      return null;
                  }
              });
              if (column.align === 'right') {
                  field.fieldStyle = 'text-align:right';
              }


              if (column.xtype === 'actioncolumn') {
                  field.fieldCls += ' ' + Ext.baseCSSPrefix + 'form-action-col-field';
              }


              if (me.isVisible() && me.context) {
                  if (field.is('displayfield')) {
                      me.renderColumnData(field, me.context.record, column);
                  } else {
                      field.suspendEvents();
                      field.setValue(me.context.record.get(column.dataIndex));
                      field.resumeEvents();
                  }
              }
              if (column.hidden) {
                  me.onColumnHide(column);
              } else if (column.rendered && !initial) {
                  me.onColumnShow(column);
              }

              // -- start edit
              me.mon(field, 'change', me.onFieldChange, me);
              // -- end edit
            }
          }
        });
    }
});

Answer 1

您应该考虑使用控制器：http://docs-origin.sencha.com/extjs/4.2.1/#!/api/Ext.app.Controller

使用控制器，您可以将应用程序引导类拆分为多个小型控制器，这些控制器在需要时被调用和加载。它们可以对模型，存储和视图具有依赖性，这些模型，存储和视图将在创建控制器的新实例时加载（例如，当用户请求打开新窗口时）。

ExtJS：所有商店一次加载

1 个答案: