Extjs getStore()方法的5个奇怪行为

时间:2015-03-27 12:56:20

标签: javascript extjs

我遇到了奇怪的getStore()方法行为。

主视口有两个区域:北和中心。在北部地区有一个按钮'显示网格',若要点击此按钮,QueryResultsGridView将被加载到中心区域

var panelToAddName = Ext.create('MyApp.view.QueryResultsGridView', {});
var mainViewPort = Ext.getCmp('mainViewPort');
var centerRegion = mainViewPort.down('[region=center]');
centerRegion.removeAll();
centerRegion.add(panelToAddName);

我的商店

Ext.define('MyApp.store.QueryResultsGridStore', {
    extend: 'Ext.data.Store',
    model: 'MyApp.model.QueryResultsGridModel',
    alias: 'store.queryResultsGrid',
    autoLoad: true,
    proxy: {
        type: 'ajax',
        url: 'queryResultsGrid.json',
        reader: {
            type: 'json'
        }
    }
});

我的ViewModel

Ext.define('MyApp.viewmodel.MainViewModel', {
    extend: 'Ext.app.ViewModel',

    requires: [
        'MyApp.store.QueryResultsGridStore'
    ],

    alias: 'viewmodel.main',

    stores: {
        queryResultsGrid: {
            type: 'queryResultsGrid'
        }
});

我的小组

Ext.define('MyApp.view.QueryResultsGridView', {
    extend: 'Ext.Panel',
    requires: [
        'MyApp.controller.QueryResultsGridViewController'
    ],
    controller: 'queryResultsGrid',
    listeners: {
        afterrender: 'onFormAfterRender'
    },
    items:[{
        reference: 'queryResultsGrid',
        layout: 'fit',
        items: [
        {
            xtype: 'grid',
            reference: 'grid',
            bind: {
                store: '{queryResultsGrid}'
            },
            columns: [
                { text: 'Text1', dataIndex: 'text1', flex: 1 },
                { text: 'Text2', dataIndex: 'text2', flex: 3 }
            ]
        }]
    }]
});

我的ViewController

Ext.define('MyApp.controller.QueryResultsGridViewController', {
    extend: 'Ext.app.ViewController',

    alias: 'controller.queryResultsGrid',

    onFormAfterRender: function(form, parent1) {
        console.log(form.down('grid'));
        console.log(form.down('grid').store);
    }
});

现在在控制台中,我看到上面建议的2个对象。如果我进入第一个Object里面有一个数据,但是在第二个商店里面是空的。谁能建议我为什么?顺便说一下,我需要这个商店来运行store.load()。

第一个对象

first Object

第二个对象

second object

已更新

这是https://fiddle.sencha.com/fiddle/kf3/preview如果它有帮助,你可以在控制台中看到我上面提到的2个对象。源代码可在此处https://fiddle.sencha.com/#fiddle/kf3

获取

3 个答案:

答案 0 :(得分:0)

您可以使用Ext.getStore()方法获取任何商店

答案 1 :(得分:0)

是否因为您将商店设置为autoLoad?商店对象从一个时刻变为另一个时刻,我想知道由于autoLoad被设置为true导致数据被覆盖。请尝试删除autoLoad或将其设置为false。

如果这不起作用,您可以尝试设置Sencha Fiddle,以便我们可以看到这一点。

答案 2 :(得分:0)

我终于明白了。如果要为网格设置afterrender事件(而不是面板本身),并且在评论中使用Colin建议的this.getViewModel().getStore('queryResultsGrid'),则不会出现此问题。

我已经更新了小提琴。