Ext JS 5 JSON存储数据:Filter配置不起作用

时间:2014-08-05 06:40:29

标签: json mvvm datastore extjs5

我遇到了一些关于Ext JS 5过滤器配置的问题。我在我的应用程序中使用了MVVM架构,我使用MVVM从最新的Sencha的Executive Dashboard复制了一个示例。代码在这里:

StoreModel:

Ext.define('ExecDashboard.model.Kpi', {
extend: 'ExecDashboard.model.Base',

fields: [
    'category',
    'name',
    'data1',
    'data2',
    'data3',
    'data4',
    'data5'
]});

商品

Ext.define('ExecDashboard.store.Kpi', {
extend: 'Ext.data.Store',
alias: 'store.kpi',

model: 'ExecDashboard.model.Kpi',
remoteFilter: true,

proxy: {
    type: 'memory',
    reader: 'array',

    data: [
          [85,"redemption","April 2013",        97.71415293,     42.80623324     ],
        [86,"redemption","May 2013",          103.9686145,     53.72375476     ],
        [87,"redemption","June 2013",         85.34685203,     38.82037102     ],
        [88,"redemption","July 2013",         98.73416455,     62.15346433     ],
        [89,"redemption","August 2013",       75.32157973,     23.66379738     ],
        [90,"redemption","September 2013",    89.72719705,     62.24478753     ],
        [91,"redemption","October 2013",      81.8442231,      40.25135437     ],
        [92,"redemption","November 2013",     101.3772379,     22.24866309     ],
        [93,"redemption","December 2013",     75.63304388,     60.02298886     ],
        [94,"redemption","January 2014",      97.43899851,     31.43154371     ],
        [95,"redemption","February 2014",     93.51713151,     30.88595132     ],
        [96,"redemption","March 2014",        83.14395398,     58.95084719     ],
        [97,"redemption","April 2014",        66.7850417,      14.93916416     ],
        [98,"redemption","May 2014",          60.9905471,      51.16786536     ],
        [99,"redemption","June 2014",         54.65355603,     41.00113419     ],
        [100,"sales","May 2010",              39.31109289,     57.59563546     ],
        [101,"sales","June 2010",             40.91728573,     42.88747711     ],
        [102,"sales","July 2010",             58.94113927,     23.32729559     ],
        [103,"sales","August 2010",           52.95083591,     24.33871661     ],
        [104,"sales","September 2010",        21.11758313,     29.60587097     ],
        [105,"sales","October 2010",          53.53800894,     30.04906835     ]
    ]

视图模型:

Ext.define('ExecDashboard.view.kpi.KpiModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.kpi',

requires: [
    'ExecDashboard.model.Kpi',
    'ExecDashboard.store.Kpi'
],

data: {
    // This property is placed in the ViewModel by routing
    // kpiCategory: null
},

stores: {
    kpiMain: {
        type: 'kpi',
        autoLoad: true,
        filters: {
            property: 'category',
            value: '{kpiCategory}'
        }
    }
}});

控制器:

Ext.define('ExecDashboard.view.kpi.KpiController', {
extend: 'Ext.app.ViewController',
alias: 'controller.kpi',

init: function (view) {
    // We provide the updater for the activeState config of our View.
    view.updateActiveState = this.updateActiveState.bind(this);
},

onToggleKpi: function(button) {
    if (button.pressed) {
        var view = this.getView();
        view.setActiveState(button.filter);
    }
},

updateActiveState: function (activeState) {
    var refs = this.getReferences();
    var viewModel = this.getViewModel();

    refs[activeState].setPressed(true);
    viewModel.set('kpiCategory', activeState);

    this.fireEvent('changeroute', this, 'kpi/' + activeState);
}});

- >上面的代码工作正常,包括过滤,如果数据是在商店内部声明的,但是如果我转换json文件中的确切数据,过滤器功能不再工作,虽然没有指出错误,数据显示但是onclick按钮不再有效。

我将商店改造成这样的东西:

(新)商店

Ext.define('ExecDashboard.store.Kpi', {
extend: 'Ext.data.Store',
alias: 'store.kpi',
storeId:'Kpi',

requires:['ExecDashboard.model.Kpi'],

model: 'ExecDashboard.model.Kpi',
remoteFilter: true,
buffered: true,
pageSize: 100,
remoteSort: true,


   proxy: {
    type: 'ajax',
    reader: 'json',
    url: 'resources/data/members_util_costcount.js',
    autoLoad: true  
}});

members_util_costcount.js

[
{ "category": "redemption",  "name": "May 2010", "data1": 105.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "June 2010", "data1": 250.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "July 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "August 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "September 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "October 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "November 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "December 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "January 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "February 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "March 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "April 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name":"May 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "June 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "July 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "redemption",  "name": "August 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 350.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "June 2010", "data1": 500.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "July 2010", "data1": 700.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "August 2010", "data1": 800.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "September 2010", "data1": 900.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "October 2010", "data1": 1000.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "November 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "December 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "January 2011", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{ "category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{ "category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{ "category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{ "category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 },
{"category": "sales",  "name": "May 2010", "data1": 53.34321776, "data2":  100.1152082 }
]

这是一个错误吗?我没有进行大量修改,只是将内联数据存储转换为JSON文件。

1 个答案:

答案 0 :(得分:1)

无需回答这个问题,因为我已经找到了解决方案,它应该是“remoteFilter”:false