ExtJS 5 Label-in-Symbolleiste nicht aktualisiert, wenn Überlauf

Question

var enableBtn = Ext.create('Ext.button.Button', { 
     text : 'Edit Label', 
     disabled: false, 
     scope : this, 
     handler : function() { 
      //disable the enable button and enable the disable button 
      //enableBtn.disable(); 
      //disableBtn.enable(); 

     //enable the toolbar 
     //toolbar.enable(); 
     tFieldPage.setText('7'); 
    } 
}); 

var tFieldPage = new Ext.form.Label({ 
      text: 1 
     }); 

var toolbar = Ext.create('Ext.toolbar.Toolbar', { 
    //renderTo: document.body, 
    //width : 400, 
    enableOverflow: true, 
    margin : '5 0 0 0', 
    items : [enableBtn, tFieldPage] 
}); 


Ext.create('Ext.window.Window', { 
     title: 'Standard', 
     closable: false, 
     height:250, 
     width: 500, 
     bodyStyle: 'padding:10px', 
     //contentEl: 'content', 
     scrollable: true, 
     tbar: toolbar 
    }).show(); 

Ich ExtJS 5.0.1 verwenden, und ich fand, dass, wenn Sie das Fenster verkleinern und das Etikett ‚1‘ gehen in Überlaufmenü, wenn ich die Taste drücken, um zu aktualisieren, das Etikett, es würde nicht aktualisiert werden. Wenn ich jedoch die Symbolleiste erweitere, wird das Label erneut aktualisiert. Bei der Inspektion wurde mir klar, dass beim Überlauf automatisch ein anderes Etikett erstellt wird. Wie erhalte ich die ursprüngliche Komponente, die ich erstellt habe, um die geklonte Version im Überlaufmenü zu aktualisieren?

Ich habe den Code oben mit Sencha Fiddle getestet und der gleiche Fehler erscheint auch. Irgendwelche Vorschläge oder ist das ein Framework-Problem?

EDIT: Meine Geige Link: https://fiddle.sencha.com/#view/editor&fiddle/1nc7

Dank.

Answer 1

Die Label-Komponente in Privat Ext.layout.container.boxOverflow.Menu (zweimal - ich forsche nicht warum) neu erstellen. Für neu erstellen Label verwendet initialConfig des ursprünglichen Labels. So ist es möglich:

• Originaletikett
  • Set-Taste handler Rahmen als Etikett
  • get-Symbolleiste zu bekommen und dann Label: comp.up('toolbar').down('label'))
• Originaletikett Text zu ändern: setText()

• Text in neu erstellten Etiketten ändern initialConfig

  var tFieldPage = new Ext.form.Label({ 
      text: 1 
  }); 
  
  var enableBtn = Ext.create('Ext.button.Button', { 
      text : 'Edit Label', 
      disabled: false, 
      scope : tFieldPage,//bind scope 
      handler : function(comp, event) { 
      console.log('btnhandler scope: ',comp.id); 
      console.log('btnhandler scope.owner: ',comp.ownerCt.id); 
      if(comp.up('button')){ 
       console.log('original label: ', comp.up('toolbar').down('label')); 
       console.log('recreated label: ', comp.nextSibling()); 
      } 
      this.setText('7'); 
      this.initialConfig.text = 7; 
      } 
  }); 
  

Hier ist fiddle