添加/删除记录时更新图表 Ext JS

Question

ExtJS 7.0 现代 图表的记录在编辑网格单元格时会发生变化，但在我添加/删除行时不会发生变化。 我已经在控制器页面中尝试了 store.sync()、store.update()、.load()，但这些接缝都没有工作。 这是我试图放置逻辑的块。 （除与图表同步外，一切正常）

showChart: function(btn){
    var chart = Ext.create({
        xtype: 'kleachart'

    }) ;
    chart.show() ;
    console.log("CHART",chart) ;
},

https://fiddle.sencha.com/#view/editor&fiddle/2vh0

提前谢谢！

Answer 1

问题是商店的多个实例。 当您创建kleachart的新实例（还有那里的viewModel实例）时 - 将创建新的 store 实例。

showChart: function (btn) {
    var store = this.getView().getStore();
    //model = store.getRecordModel();
    console.log("STORE", store);

    // store = this.getView().getStore().getData();
    // here your logic (see at "reloadStore")
    var chart = Ext.create({
        xtype: 'kleachart',
        title: 'Hello',
        // handler: function (btn) {
        //    store.sync();
        // }

    });

    chart.show();

    console.log("CHART", chart);

}

您可以像这样引用旧商店：

showChart: function (btn) {
    var store = this.getView().getStore(),
        parentViewModel = this.getViewModel();
    var chart = Ext.create({
        xtype: 'kleachart',
        title: 'Hello',
        viewModel: new Ext.app.ViewModel({
            stores: {
                klea: store
            }
         })
    });
    chart.show();
},

检查更新的Fiddle 。