跳至主内容
版本:当前版本

IntersectionObserverEntry 🧪

非官方测试版翻译

本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →

非官方测试版翻译

本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →

Canary 🧪

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

如果你想试用,请在你的应用中启用 Canary 频道。

IntersectionObserverEntry 接口遵循 Web 规范定义,用于描述在特定过渡时刻目标元素与其根容器之间的交叉状态。

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


参考

实例属性​

boundingClientRect​

参阅 MDN 文档。

以 DOMRectReadOnly 对象形式返回目标元素的边界矩形。

intersectionRatio​

参阅 MDN 文档。

返回 intersectionRect 与 boundingClientRect 的比值。

intersectionRect​

参阅 MDN 文档。

返回表示目标元素可见区域的 DOMRectReadOnly 对象。

isIntersecting​

参阅 MDN 文档。

布尔值,当目标元素与交叉观察者的根元素相交时为 true。若为 true,表示 IntersectionObserverEntry 描述的是进入交叉状态的过渡;若为 false,则表示从相交状态过渡到不相交状态。

rnRootIntersectionRatio ⚠️​

非标准

此为 React Native 特有的扩展。

返回 intersectionRect 与 rootBounds 的比值。

ts
get rnRootIntersectionRatio(): number;

此属性类似于 intersectionRatio,但计算基准是根元素的边界框而非目标元素的边界框。它对应 rnRootThreshold 选项,用于确定目标元素覆盖根区域的比例。

rootBounds​

参阅 MDN 文档。

返回交叉观察者根元素的 DOMRectReadOnly 对象。

target​

参阅 MDN 文档。

与根元素交叉状态发生变化的 Element。

time​

参阅 MDN 文档。

DOMHighResTimeStamp 类型值,表示记录交叉发生的时间(相对于 IntersectionObserver 的时间原点)。