Ошибка ExtJS: невозможно получить значение свойства dataSource

Question

Я основывал это на примере Sencha; однако вместо того, чтобы использовать url для заполнения магазина, я попытался создать пустую и добавить к ней элемент. Когда я загружаю страницу, элемент успешно отображается на панели; Однако, я получаю сообщение об ошибке говорящее

Line: 18 
Error: Unable to get value of the property 'dataSource': object is null or undefined 

Моя модель выглядит следующим образом:

Ext.define('Ext.model.Test', { 
    extend: 'Ext.data.Model', 
    fields: [ 
     { name: 'testName', type: 'string' }, 
     { name: 'hasTestPassed', type: 'bool' }, 
     { name: 'hasFix', type: 'bool' } 
    ] 
}); 

Мой код выглядит следующим образом:

Ext.define('Ext.app.ServerChecker', { 
    extend: 'Ext.grid.Panel', 
    requires: [ 
     'Ext.selection.CellModel', 
     'Ext.grid.*', 
     'Ext.data.*', 
     'Ext.util.*', 
     'Ext.form.*', 
     'Ext.model.Test' 
    ], 
    alias: 'widget.ServerChecker', 
    xtype: 'cell-editing', 

    initComponent: function() { 
     this.cellEditing = new Ext.grid.plugin.CellEditing({ 
      clicksToEdit: 1 
     }); 

     Ext.apply(this, { 
      width: this.width, 
      store: new Ext.data.Store({ 
       // destroy the store if the grid is destroyed 
       autoDestroy: true, 
       model: Ext.model.Test, 
       proxy: { 
        type: 'memory', 
        reader: { 
         type: 'json', 
         record: 'test' 
        } 
       }, 
       sorters: [{ 
        property: 'common', 
        direction: 'ASC' 
       }] 
      }), 

      columns: [{ 
       header: 'Test Name', 
       dataIndex: 'testName', 
       flex: 1, 
       editor: { 
        allowBlank: false 
       } 
      }, { 
       header: 'Result', 
       dataIndex: 'hasTestPassed', 
       width: '75px', 
       align: 'right', 
       editor: { 
        allowBlank: false 
       } 
      }, { 
       xtype: 'actioncolumn', 
       width: 30, 
       sortable: false, 
       menuDisabled: true, 
       items: [{ 
        icon: 'resources/images/icons/fam/delete.gif', 
        tooltip: 'Delete Plant', 
        scope: this, 
        handler: this.onRemoveClick 
       }] 
      }], 
      selModel: { 
       selType: 'cellmodel' 
      }, 
      tbar: [{ 
       text: 'Run Tests', 
       scope: this, 
       handler: this.onRunTestsClick 
      }] 
     }); 

     this.callParent(); 

     this.on('afterlayout', this.loadStore, this, { 
      delay: 1, 
      single: true 
     }) 
    }, 

    loadStore: function() { 
     this.getStore().load({ 
      // store loading is asynchronous, use a load listener or callback to handle results 
      callback: this.onStoreLoad 
     }); 
    }, 

    onStoreLoad: function() { 
     var rec = new Ext.model.Test({ 
      testName: 'Yipiee', 
      hasTestPassed: true, 
      hasFix: true 
     }); 
     this.getStore().insert(0, rec); 
     this.cellEditing.startEditByPosition({ 
      row: 0, 
      column: 0 
     }); 
    }, 

    onRemoveClick: function (grid, rowIndex) { 
     this.getStore().removeAt(rowIndex); 
    } 
}) 

Любая помощь будет принята с благодарностью. Я понимаю, что я загружаю данные в виде странного места; однако это предназначено для тестирования, и, похоже, он должен работать нормально.

Заранее спасибо.

Answer 1

Вы определяете хранилище с прокси-сервером памяти, который ожидает, что хранилище будет иметь свойство данных при загрузке. Итак, когда вы делаете this.getStore().load(..), вы получаете сообщение об ошибке. Фактически вы добавляете данные в хранилище в обратном вызове нагрузки, обычно обратный вызов используется для выполнения чего-либо после фактического загрузки хранилища. Я действительно не понимаю, что вы пытаетесь сделать, но если вы просто хотите загрузить запись непосредственно в хранилище, без какой-либо обработки, вам вообще не нужен прокси-сервер. Ваша функция loadStore может выглядеть так:

loadStore: function() { 
    var obj = { 
     testName: 'Yipiee', 
     hasTestPassed: true, 
     hasFix: true 
    }; 
    this.getStore().add(obj); 
}