ExtJS：仅为Ext.panel.Panel物品容器设置加载蒙版

Question

我有Ext.panel.Panel工具栏（dockedItems）和动态创建的内容（items）。我只想要.setLoading()面板项目并保持活动状态。有没有办法选择面板项目容器组件？

P.S.我可以使用myPanel.items.each(function(item) {item.setLoading()})，但它的不好解决方案imo。

Answer 1

您始终可以将加载蒙版应用于面板主体，因此工具栏处于活动状态并且可点击。

做这个操作非常简单。 您必须调用.setLoading()面板，其中指定setLoading(load, target)其中load是布尔值，目标是加载掩码的目标，该值应该是target = panel.body之类的值。

根据我的答案我做了一点点捣鼓你：

https://fiddle.sencha.com/#fiddle/12h0

小提琴的代码是：

Ext.application({ 
name: 'Fiddle', 

launch: function() { 
    Ext.create('Ext.panel.Panel', { 
     renderTo: Ext.getBody(), 
     border: true, 
     width: 200, 
     height: 200, 
     margin: 100, 
     id: 'myPanel', 
     defaults: { 
      margin: 10 
     }, 
     layout: { 
      type: 'vbox', 
      pack: 'middle' 
     }, 
     items: [{ 
      xtype: 'textfield', 
      id: 'input' 
     }, { 
      xtype: 'panel', 
      html: 'Other things', 
      border: false 
     }], 
     dockedItems: [{ 
      xtype: 'toolbar', 
      dock: 'bottom', 
      items: [{ 
       text: 'Start Loading', 
       listeners: { 
        click: function(th) { 
         Ext.getCmp('input').setValue('opetation'); 
         var panel = Ext.getCmp('myPanel'); 
         if (!panel.loading) panel.loading = true; 
         else panel.loading = false; 
         panel.setLoading(panel.loading, panel.body); 

         th.setText(panel.loading ? 'Stop Loading' : 'Start Loading'); 
        } 
       } 
      }] 
     }] 
    }); 
} 
});