Dojo：浮动窗格在关闭和重新打开时抛出错误

Question

我有一个使用 Dojo 框架开发的应用程序。在这个应用程序中，我显示了一个浮动窗格。

我将此 floatingPane 配置为 closable。

所以我面临的问题是，当我关闭 floatingPane 并尝试重新打开它时，它没有显示并开始在控制台中抛出错误。

这似乎是 Dojo Framework 本身的问题，因为我可能会在他们的文档中遇到同样的问题。

示例可以参考页面：https://dojotoolkit.org/reference-guide/1.10/dojox/layout/FloatingPane.html

在此示例中，请按照以下步骤重现问题：

单击程序化示例的运行按钮
单击显示给我（它将显示浮动窗格）
在右上角，点击关闭按钮关闭
再次单击显示我按钮。（这行不通）

Answer 1

这不是错误，它已经这样定义了，如果你看到这个浮动窗格的源代码，你会注意到关闭按钮绑定到 close ：函数最后隐藏小部件并在调用 this.destroyRecursive() 之后小部件被完全销毁尝试再次显示时会抛出错误。

所以，您可以通过创建一个扩展 FloatingPane 小部件来解决这个问题如下所示覆盖关闭功能（仅隐藏浮动窗格）

var CustomFloatingPane = declare(FloatingPane, {
  close: function(e) {
    // overinding close function
    this.hide();
  }
});

参见下面的工作示例：

require(["dojo/_base/declare","dojox/layout/FloatingPane", "dojo/dom", "dojo/ready", "dijit/form/Button"], function(declare, FloatingPane, dom, ready, Button) {
  ready(function() {
  
    var CustomFloatingPane = declare(FloatingPane, {
      close: function(e) {
        this.hide();
      }
    });
    
  
    myCustomloatingPane = new CustomFloatingPane({
      title: "A floating pane",
      resizable: true,
      dockable: true,
      style: "position:absolute;top:0;left:0;width:100px;height:100px;visibility:hidden;",
      id: "myCustomloatingPane"
    }, dom.byId("customFloatingPane"));

    myCustomloatingPane.startup();
  });
});

<script type="text/javascript">
  dojoConfig = {
    isDebug: true,
    async: true,
    parseOnLoad: true
  }
</script>

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css" rel="stylesheet" />
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojox/layout/resources/ResizeHandle.css" rel="stylesheet" />
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojox/layout/resources/FloatingPane.css" rel="stylesheet" />


<body class="claro">
<div id="customFloatingPane">Hi I'm custom floating pane , extended to hide istead of destroy and close :) </div>
</body>
<div data-dojo-type="dijit.form.Button" data-dojo-props="label:'Show me', onClick:function(){myCustomloatingPane.show();}"></div>
<br/><br/><br/><br/>

Dojo：浮动窗格在关闭和重新打开时抛出错误

Dojo: Floating Pane throws error on closing and re-opening it

javascript

dojo

floating

dijit.layout