ExtJS 5.x 저장로드 후 격자보기 (viewConfig)를 변경하는 방법은 무엇입니까?</p> <pre><code>Ext.define('MyApp.page.PageModel', { extend: 'Ext.app.ViewModel', //... stores: { Posts: { model: //... } } }); </code></pre> <p>와 같은 그리드 :

Question

내가 좋아하는 뷰 모델에 저장이

Ext.define('MyApp.page.MainView', { 
    extend: 'Ext.panel.Panel', 
    //... 

    initComponent: function() { 
     var me = this; 
     //... 

     me.items = [ 
      { 
       xtype: 'grid', 
       bind: { 
        store: '{Posts}' 
       }, 
       columns: [ /* ... */ ], 
       viewConfig: { 
        getRowClass: function (record) { 
         //... 
        } 
       } 
      } 
     ]; 

     me.callParent(arguments); 
    } 
}); 

어떻게 (내 경우) 저장로드 후에 그리드보기를 변경할 수 있습니까?

나는 그리드 이벤트 ( beforerender 및 viewready)에서 mon 및 addManagedListener 방법을 사용하려하고 나는 그 그리드 이벤트 내부에 저장하는 on 및 addListener 방법을 사용했지만,이 솔루션은 작동하지 않습니다.

누군가 아이디어가 있습니까?

의 ExtJS 6에서

Answer 1

난 그냥 가게로드 이벤트 전에 emptyEl 및 viewEl을 취소, Ext.view.AbstractView에 대한 재정의를 사용하고 여기에

store.on('beforeload', function() { 
    me.clearEmptyEl(); 
    me.clearViewEl(); 
}); 

내 전체 재정의 당신이 변경 원하는 작업

Ext.define('Ext.overrides.view.AbstractView', { 
    override: 'Ext.view.AbstractView', 

    onBindStore: function(store, initial, propName) { 
     var me = this; 

     me.setMaskBind(store); 
     // After the oldStore (.store) has been unbound/bound, 
     // do the same for the old data source (.dataSource). 
     if (!initial && propName === 'store') { 
      // Block any refresh, since this means we're binding the store, which will kick off 
      // a refresh. 
      me.preventRefresh = true; 
      // Ensure we have the this.store reference set correctly. 
      me.store = store; 
      me.bindStore(store, false, 'dataSource'); 
      me.preventRefresh = false; 
     } 
     store.on('beforeload', function() { 
      me.clearEmptyEl(); 
      me.clearViewEl(); 
     }); 
    } 
}); 

Answer 2

이 함수 setEmptyText 당신을 위해이 작업을 수행 할 그리드로 볼 수 있습니다 :

initComponent: function() { 
    var me = this; 
    //... 

    me.callParent(arguments); 
    me.getStore().on('load', function() { 
     me.setEmptyText(...); 
    }) 
} 

를 ExtJS에 5에서, 당신은 당신의 자신에 할 필요가 :

me.getStore().on('load', function() { 
     var emptyText = 'Test empty text'; 
     me.getView().emptyText = '<div class="' + me.emptyCls + '">' + emptyText + '</div>'; 
     me.getView().refresh(); 
    }) 

Relevant fiddle 렌더링 후 3 초 후에 매장을로드합니다.