检测自定义元素上的滚动事件

Question

我已经用 Polymer 编写了我的自定义元素。该元素有很多子元素。我想 检测元素的滚动事件 以便我可以将一些内容延迟加载到其中。有可能吗？

Answer 1

看看这个聚合物元素是否对你有用，https://www.polymer-project.org/docs/elements/core-elements.html#core-scroll-threshold 在任何情况下，如果没有你正在使用的代码的例子，很难确切地知道发生了什么，Jsbin 也可以很棒

Answer 2

尝试：

HTML:

<CUSTOMELEMENT onscroll="scrollHandler">

  ...child elements here...

</CUSTOMELEMENT>

JS:

function scrollHandler(){
    console.log("scrolled!");
}

Answer 3

您可以向您的元素添加滚动事件侦听器：

listeners: {
    'scroll': '_userDidScrollFullElement',        
  },

此代码将在用户滚动时触发 Polymer 元素上的 _userDidScrollFullElement 函数。

如果你想更具体一点，只想在用户滚动子元素时触发该功能，你可以执行以下操作：

listeners: {
    'your__element__id.scroll': '_userDidScrollSpecificElement',        
  },

仅当用户滚动具有 id your__element__id.

的子元素时，此代码才会在您的 Polymer 元素上触发函数 _userDidScrollSpecificElement 函数

有关活动的更多信息，您可以查看 Polymer Events page。

Detect onscroll event on custom element