Làm thế nào để ràng buộc đúng một công thức với một cửa hàng trong Sencha ExtJs v6?

Question

Đây là một cấu hình cho công thức:

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

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

(hiện nay là số lượng mà chúng tôi muốn chỉ hiển thị một lần ban đầu có nghĩa là trên tải nó hoạt động ok)

Khi các mô hình bên trong organizationCars cửa hàng có một thuộc tính được cập nhật ràng buộc không hoạt động, cửa hàng không được cảnh báo rằng các mô hình của nó đã được cập nhật.

Điều gì lý tưởng sẽ xảy ra là khi mô hình được cập nhật sự kiện được truyền tới cửa hàng để cửa hàng biết rằng sự thay đổi đó. Bằng cách này, ràng buộc sẽ hoạt động (?) Và công thức sẽ được tính toán.

Answer 1

Tôi không nghĩ rằng điều này thực sự có thể sử dụng công thức, nhưng bạn có thể thực hiện bằng các sự kiện.

bằng cách nghe các sự kiện loaddatachanged và update bạn có thể được thông báo về bất kỳ thay đổi nào đối với cửa hàng, từ đây bạn có thể thực hiện công việc và đặt thủ công trên ViewModel.

fiddle Điều này cho thấy giải pháp tốt nhất: https://fiddle.sencha.com/#view/editor&fiddle/1qvf

cửa hàng

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 
    } 
}); 

khiển

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) 
    } 
});