跳到主要内容
版本:0.85

IntersectionObserverEntry 🧪

Canary 🧪

此 API 目前仅在 React Native 的 Canary 和 Experimental 渠道中可用。

如果您想尝试,请在您的应用中 启用 Canary 渠道。

IntersectionObserverEntry 接口,如 Web 规范中所定义。它描述了目标元素与其根容器在特定时刻的交叉情况。

IntersectionObserverEntry 的实例会通过 IntersectionObserver 回调的 entries 参数传递。


参考

实例属性​

boundingClientRect​

参见 MDN 文档。

返回目标元素的边界矩形,类型为 DOMRectReadOnly。

intersectionRatio​

参见 MDN 文档。

返回 intersectionRect 与 boundingClientRect 的比率。

intersectionRect​

参见 MDN 文档。

返回一个表示目标可见区域的 DOMRectReadOnly。

isIntersecting​

参见 MDN 文档。

一个布尔值,如果目标元素与交叉观察器的根相交则为 true。如果为 true,则 IntersectionObserverEntry 描述的是进入交叉状态的过渡;如果为 false,则你知道过渡是从交叉状态变为非交叉状态。

rnRootIntersectionRatio ⚠️​

Non-standard

这是 React Native 特有的扩展。

返回 intersectionRect 与 rootBounds 的比率。

TypeScript
get rnRootIntersectionRatio(): number;

这类似于 intersectionRatio,但是相对于根的边界框而不是目标的边界框计算的。这对应于 rnRootThreshold 选项,允许你确定目标元素覆盖了根区域的百分比。

rootBounds​

参见 MDN 文档。

返回交叉观察器根的 DOMRectReadOnly。

target​

参见 MDN 文档。

与根的交叉情况发生变化的 Element。

time​

参见 MDN 文档。

一个 DOMHighResTimeStamp,指示记录交叉情况的时间,相对于 IntersectionObserver 的时间原点。