如何在Sencha ExtJs v6中将商店正确绑定到商店？ [英] How to bind correctly a formula with a store in Sencha ExtJs v6?

问题描述

下面是公式的配置：

 公式：{
 //这个与商店的绑定不工作:( 
 countDeactivatedVehicles：{
 bind：{
 bindTo：{organizationCars}，
 deep：true，
}，
 
 get：function（store）{
 return store.query（isCarActive，false）.getCount（）; 
} 
} 
} 
  

（现在我们想要的计数只显示一次，意味着在加载时它的工作正常）

当商店organizationCars中的模型更新了一个属性时，绑定不起作用，商店不会警告其模型已被更新。

理想的情况是，当模型更新时，事件被传播到商店，以便商店知道这是改变的，这样绑定就可以工作（？），公式会得到计算。

解决方案

我不认为这可能是使用公式，但可以使用事件。

by收听加载 datachanged 和更新可以通知您的事件对于商店的任何更改，从这里您可以在公式中进行操作，并在ViewModel上手动设置。

此小提琴最佳显示解决方案： https://fiddle.sencha.com/#view/editor&fiddle/1qvf

商店

  Ext.define（'Fiddle.Store' ，{
 extends：'Ext.data.Store'，
 alias：'store.test'，
 listeners：{
 load：'storeUpdate'，
 update ：'storeUpdate'，
 datachanged：'storeUpdate'
}，
 fields：[{
 name：'include'，
 type：'bool'
}] 
}）; 
  

ViewModel

  Ext.define（'Fiddle.StoreBinderViewModel'，{
 extends：'Ext.app.ViewModel'，
 alias：'viewmodel.storebinder'，
 stores：{
 teststore：{
 type：'test'
} 
}，
 data：{
 includedTotal：0 
} 
}） ; 
  

控制器

  Ext.define（'Fiddle.StoreBinderController'，{
 extends：'Ext.app.ViewController'，
 alias：'controller.storebinder'，
 storeUpdate：function（store ）{
 var recs = store.query（'include'，true）; 
 this.getViewModel（）。set（'includedTotal'，recs.length）
} 
} ）; 
  

Here is a configuration for the formula:

formulas: {
    //this binding with the store did not work :(
    countDeactivatedVehicles: {
        bind: {
            bindTo: "{organizationCars}",
            deep: true,
        },

        get: function (store) {
            return store.query("isCarActive", false).getCount();
        }
    }
}

(currently now the count that we want is only displayed once initially meaning that on load it works ok)

When the models inside the store organizationCars have an attribute updated the binding does not work, the store is not alerted that its models have been updated.

What ideally should happen is when the model gets updated the event is propagated to the store so that the store knows that is changed. This way the binding would work (?) and the formula would get calculated.

解决方案

I don't think this is actually possible using formulas, but you can do using events.

by listening to load datachanged and update events you can be notified of any changes to the store, from here you can do what you would do in a formula and manually set on the ViewModel.

This fiddle shows the solution best: https://fiddle.sencha.com/#view/editor&fiddle/1qvf

Store

Ext.define('Fiddle.Store', {
    extend: 'Ext.data.Store',
    alias: 'store.test',
    listeners: {
        load: 'storeUpdate',
        update: 'storeUpdate',
        datachanged: 'storeUpdate'
    },
    fields: [{
        name: 'include',
        type: 'bool'
    }]
});

ViewModel

Ext.define('Fiddle.StoreBinderViewModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.storebinder',
    stores: {
        teststore: {
            type: 'test'
        }
    },
    data: {
        includedTotal: 0
    }
});

Controller

Ext.define('Fiddle.StoreBinderController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.storebinder',
    storeUpdate: function (store) {
        var recs = store.query('include', true);
        this.getViewModel().set('includedTotal', recs.length)
    }
});

这篇关于如何在Sencha ExtJs v6中将商店正确绑定到商店？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！