禁止点击 Polymer 中的自定义元素答案

【问题标题】：Disable custom element in Polymer from being clicked禁止点击 Polymer 中的自定义元素
【发布时间】：2018-01-19 10:36:36
【问题描述】：

禁用自定义元素被点击的最佳方法是什么（例如，当它处于动画状态时，或者只是因为它应该被用户禁用）。这意味着不应触发诸如“click”/“tap”之类的输入事件并禁用链接。

我想禁用整个元素，包括其他纸元素，而不仅仅是纸按钮等。为此，我知道有“禁用”属性。

CSS 和 pointer-events 最好用吗？还是有其他适用于所有浏览器的方法？

【问题讨论】：

我使用了没有像你说的那样的指针事件，它可以解决问题。我想如果你想要你也可以设置一个属性来确保你的事件不会被调度。跨度>
给出一个你想禁用的示例代码。对于 Polymer，大多数元素都有一个 disabled 属性，您可以在函数中绑定值 this.disable=true 将禁用所有具有 disabled="{{disable}} 的元素

【解决方案1】：

谢谢，我现在按照以下方式进行操作，效果很好：

在自定义样式中

  :host([disabled]) {
    color: #a8a8a8;
    cursor: auto;
    pointer-events: none;
  }

在属性中

      disabled: {
        type: Boolean,
        notify: true,
        reflectToAttribute: true
      }

在代码中

       this.disabled = false;

【讨论】：