如何判断IntersectionObserver是否仍在观察某些东西

Question

我正在使用IntersectionObserver来监视一组项目，然后在我的回调对其进行更改后取消观察每个项目。

var watchItems = new IntersectionObserver(alterItem,{threshold:[0.3]}),
items = $(".item");

for(i=0;i<items.length;i++){
    watchItems.observe(items[i]);
}

function alterItem(observation) {
    observation.forEach(function (item) {
        if (item.isIntersecting) {
            // do stuff
            watchItems.unobserve(item.target);
        }
    });
}

如果我所有的物品都经过此过程，我想使用watchItems.disconnect()完全停用观察者。我不确定将其保持打开状态（可能微不足道）可能会对内存产生什么样的影响，但是作为一种好习惯，我喜欢在完成处理后将其关闭。

我知道我可以通过跟踪项目的数量并将其与未观察到的次数进行匹配，或者通过使用data属性来解决，但是我想知道是否有人知道它是否是固有的。 API。显然，它以某种方式跟踪了现有的观察者，我想知道在哪里以及是否可以访问它。

在使用IntersectionObserver对象放置观察者之前和之后，我都找不到真正的线索。

Answer 1

[有一个称为takeRecords()的方法，但是即使没有更多要观察的元素，它也会返回一个（已观察到的）元素。

我通过简单地在未观察到的元素上添加一个计数器来解决它，这里是一个示例（使用了Angular和Typescript）：

[...]

private observedElements: number = 0;

[...]

// Adding elements to be observed

this.observer.observe(myItem.nativeElement);
this.observedElements++;

[...]

// If element is visible

if (observerEntry.isIntersecting) {

   this.observer.unobserve(observerEntry.target);
   this.observedElements--;

   if (this.observedElements === 0) {

      this.observer.disconnect();
      this.observer = null;

   }

}

[...]

使其适应您的需要并节省内存：）。

希望有帮助。

欢呼Unkn0wn0x