javascript - 如何动态更改 Intersection Observer 的配置

Question

我的页面上有一个部分，当用户滚动到该部分时，会触发一个事件。该解决方案使用IntersectionObserver非常适合我的需要。rootMargin但是，当用途已经存在时，我想调整这个观察者的大小。

现在，当有这样的观察者时，最简单的方法是：

const options = { rootMargin: '20px' };
let observer = new IntersectionObserver(callback, options);

将是分配它的属性：

observer.rootMargin = '0px';

但是似乎不起作用。

是否有可能以及如何更改已创建的 Intersection Observer 的行为？

Answer 1

你不能，属性是只读的。

interface IntersectionObserver {
  readonly attribute Element? root;
  readonly attribute DOMString rootMargin;
  readonly attribute FrozenArray<double> thresholds;
  ...

你应该用一个新的观察者替换你的旧观察者。也许复制旧选项并设置您需要的内容。