Sencha touch 变量更改时更新一组面板

我有一组面板（目前有三个），它们都是同一视图的实例。 所以他们有很多共同点，比如工具栏和按钮

我在创建工具栏和按钮时定义了它们的文本，文本来自一个变量，如下所示：

App.views.CommonView = Ext.extend(Ext.Panel, {
  initComponent: function() {

    this.backBtn = new Ext.Button({
      text: globalVar,
      handler: this.onBackTap,
      scope: this
    });

    this.toolbar = new Ext.Toolbar({
      title: this.title,
      items: [this.backBtn]
    });
   }
});

anInstanceView: new App.views.CommonView({
    title: globalVar
});

anotherInstanceView: new App.views.CommonView({
    title: globalVar
});

如您所见，按钮文本和工具栏标题依赖于globalVar

当我改变这个golbalVar的值时，我想一起更新这些文本

globalVar = "new value";
// Somehow update all the button and toolbar texts on all three panels.

我不想像这样手工操作

App.views.anInstanceView.getDockedItems[0].setTitle(globalVar);

并对所有面板重复该操作。需要一个更干净的解决方案，一个更新ui的方法

那个更清洁的解决方案是什么？

---

谢谢。

我会在您的公共视图中创建一个方法，根据globalVar的值为您执行所有更新。然后，您可以在更新globalVar或创建带有“globalvarupdate”事件的全局消息总线后，为每个实例调用此方法，每个实例都可以侦听该事件，然后更新自身。类似于

// somewhere in your app setup
App.messageBus = new Ext.util.Observable();
App.messageBus.addEvents('globalvarupdate');

---

该代码完全未经测试，但希望能为您提供一种可能的方法。

这是解决我问题的一个非常好的方法。帮了大忙，谢谢。

App.views.CommonView = Ext.extend(Ext.Panel, {
  initComponent: function() {

    this.backBtn = new Ext.Button({
      text: globalVar,
      handler: this.onBackTap,
      scope: this
    });

    this.toolbar = new Ext.Toolbar({
      title: this.title,
      items: [this.backBtn]
    });

      // listen for globalvarupdate on the message bus and do the titles update
      App.messageBus.on('globalvarupdate', this.updateTitles, this);
   },

   updateTitles: function(){
      // do all updates here
   }
});

// when you need to update globalvar
globalvar = 'My New Title';
App.messageBus.fireEvent('globalvarupdate');