Question

在我的controller（ExtJS 4.2.1）中，我有一个函数，我在这里创建一个这样的窗口：

refs: [{
        ref: 'holidayView',
        selector: '[xtype=holiday.view]'
    }],
    init: function (application) {
        this.control({
            '[xtype=holiday.view] button#btnPrint': {
                click: me.onPrint
            }
        });
    },
    onPrint: function () {

        var me = this;

        var window = Ext.create('Ext.window.Window', {
            title: 'My Window',
            itemId: 'myWindow',
            width: 300,
            height: 300,
            modal: true,
            layout: fit,
            items: [{
                xtype: 'panel'
            }]
        });

        window.show();

    },
    otherFunction: function () {
        var me = this;
        // here I need to close the window
        // I tried this:

        var window = me.getHolidayView().up('#myWindow'); // but its undefined
        // me.getHolidayView() is accesible

        // I also have tried this:
        var window = me.getHolidayView().down('#myWindow'); // also its undefined

    }

关于如何获取窗口组件的任何线索，以便我可以关闭它？

谢谢 -

更新

我试过这个并且效果很好，但现在确定这是否正确：

 var win = Ext.WindowManager.getActive();
            if (win) {
                win.close();
            }

Answer 1

您的错误位于以下行中：

var window = me.getHolidayView().up('#myWindow');

默认情况下，window是浮动的，因此（默认情况下）不是所有者容器。这就是使用up()或down()无法查找的原因，因为它们不在此层次结构中。以下是访问窗口（或任何其他视图）的三种变体

变体A

使用WindowManager绝对没问题。此外，您可以从应用的每个部分执行此操作。这就是经理们的目标（如StoreManager）

var win = Ext.WindowManager.getActive();
if (win) {
    win.close();
}

变体B

但是可能存在多个窗口的情况，现在WindowManager仍然可以为您提供所有窗口，但是如果您不确定活动的窗口是否是您的窗口，则需要对它们进行迭代。寻找。此时，自动吸气器 - 或调用refs - 变得很方便。首先，您需要确保拥有自己的窗口视图或任何唯一标识符。现在，您可以为您的窗口创建ref，就像您在示例中已经完成的那样。下面是使用不同选择器的示例：

{
    ref: 'customWin',
    selector: 'window[itemId=anystring]'
}

请注意，以下选择器会查找window，其中包含名为itemId的属性itemId:'anystring'。refs。另请注意，如果不存在，则ref也可以创建窗口。有关详细信息，请参阅refs文档。另请注意，创建的App.appPropertyValue.getController('name').getCustomWin()是公共的，这意味着只需从应用程序中的任何位置获取控制器实例（我假设您已定义appProperty）并调用创建的getter，如此

getMyWindow: function() {
  var myWindow = this.myWindow;
  if (!myWindow) {
    myWindow = this.myWindow = Ext.create('Ext.window.Window', {
      title: 'My Window',
      width: 300,
      height: 300,
      modal: true,
      layout: fit,
      items: [{
        xtype: 'panel'
      }]
    });
  }
  return myWindow;
}

变体C

最后但并非最不重要的是，您可以像@incutonez一样创建自己的getter。

{{1}}

Answer 2

我以稍微不同的方式使用Ext JS，所以带着一点点盐...我甚至没有触及refs或init的东西，因为这感觉不对，但我保留了这个例子，因为我不知道holidayView是什么。我会做这样的事情：

refs: [{
  ref: 'holidayView',
  selector: '[xtype=holiday.view]'
}],
init: function (application) {
  this.control({
    '[xtype=holiday.view] button#btnPrint': {
      click: me.onPrint
    }
  });
},
onPrint: function () {
  var me = this;

  var myWindow = this.getMyWindow();
  if (myWindow) {
    window.show();
  }
},

getMyWindow: function() {
  var myWindow = this.myWindow;
  if (!myWindow) {
    myWindow = this.myWindow = Ext.create('Ext.window.Window', {
      title: 'My Window',
      width: 300,
      height: 300,
      modal: true,
      layout: fit,
      items: [{
        xtype: 'panel'
      }]
    });
  }
  return myWindow;
},

otherFunction: function () {
  var me = this;
  // here I need to close the window
  // I tried this:

  var window = me.getMyWindow(); // but its undefined
}

对我来说感觉更像OOP ......我有一个吸气剂，而且我不必担心管理ID ......显然私有变量myWindow可能会成为一个问题，但是使用吸气剂感觉更合适，我可以重复使用此窗口。

ExtJS如何从控制器内的其他功能关闭窗口

2 个答案: