对于 Polymer 1.0，如何在 <paper-dialog> 关闭或关闭时执行函数？

Question

问题：

How do I automatically execute a function whenever my <paper-dialog> element is closed?

版本：聚合物 1.0

代码：

<paper-dialog id="paper-id"
              entry-animation="scale-up-animation"
              exit-animation="scale-down-animation">
    <sample-element></sample-element>
</paper-dialog>

Answer 1

paper-dialog 继承了 Polymer.IronOverlayBehavior，它有 iron-overlay-opened 和 iron-overlay-closed 事件。

<paper-dialog
  on-iron-overlay-opened="_myOpenFunction"
  on-iron-overlay-closed="_myClosedFunction"></paper-dialog>

https://www.webcomponents.org/element/@polymer/iron-overlay-behavior
代码：https://github.com/PolymerElements/iron-overlay-behavior/blob/master/test/iron-overlay-behavior.html（例如：查看 iron-overload-opened 事件的第 147 行）

Answer 2

尽管这是老话题，但仍有一件事是人们应该知道和注意的：

我强烈建议您也检查 event.target 在您的侦听器函数中。例如，如果您有另一个元素在 paper-dialog 中使用 iron-overlay，关闭该元素将触发 paper-dialog 上的侦听器。（你可以用 vaadin-date-picker 试试这个）。

所以：

<paper-dialog on-iron-overlay-closed="_myClosedFunction"></paper-dialog>

然后 _myClosedFunction:

_myClosedFunction(e) {
  if(e.target.nodeName == "PAPER-DIALOG") {
    //...toDo stuff...
  }
}

现在你可以保证只要纸质对话框关闭，你的代码就会被执行

对于 Polymer 1.0，如何在 <paper-dialog> 关闭或关闭时执行函数？

How do I execute a function on-close or on dismiss of <paper-dialog> for Polymer 1.0?

dialog

web-component

polymer

paper-elements

polymer-1.0