Polymer中的纸质对话框未在iPhone中关闭 [英] paper-dialog in Polymer doesn't close in iPhone

问题描述

我在聚合物文档中使用此示例

I use this example from the doc of polymer

 <paper-dialog>
    <h2>Header</h2>
    <paper-dialog-scrollable>
        Lorem ipsum...
    </paper-dialog-scrollable>
    <div class="buttons">
     <paper-button dialog-dismiss>Cancel</paper-button>
     <paper-button dialog-confirm>Accept</paper-button>
   </div>
</paper-dialog>

在每个浏览器中，当我点击不是对话框的地方时对话框关闭，但在iPhone IOS上8.4它不起作用。
我无法关闭对话框。

In every browser the dialog closes when I click on place that is not the dialog, But on iPhone IOS 8.4 it doesn't work. I can't close the dialog.

如何解决这个问题？

推荐答案

经过一些研究，我在聚合物Github上发现了这个问题，并且有一种方法可以解决它的问题，所以它有效：

After some research, I found the issue on the polymer Github, and there is a way to hack it so it works:

    _finishRenderOpened: function() {
  // focus the child node with [autofocus]
  if (!this.noAutoFocus) {
    this._focusNode.focus();
  }

  if(this.withBackdrop) {
    this.parentNode.insertBefore(this._backdrop, this);
  }

  this.fire('iron-overlay-opened');

  this._squelchNextResize = true;
  this.async(this.notifyResize);
},

（代码 https://github.com/dhpollack ）

要以一种很好的方式实现dhpollack的黑客攻击，请添加此项函数到你的自定义元素：

"To implement dhpollack's hack in a nice way, add this function to your custom element:

patchOverlay: function (e) {
    if (e.target.withBackdrop) {
        e.target.parentNode.insertBefore(e.target._backdrop, e.target);
    }
},

并将 on-iron-overlay-opened =patchOverlay添加到您的所有< paper-dialog> 's

And add on-iron-overlay-opened="patchOverlay" to all your <paper-dialog>'s"

（通过 https://github.com/rubenstolk ）

Github问题： https://github.com/PolymerElements/paper-dialog/issues/7

Github issue: https://github.com/PolymerElements/paper-dialog/issues/7

希望它适合你：）

这篇关于Polymer中的纸质对话框未在iPhone中关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！