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

IntersectionObserverEntry 🧪

非官方测试版翻译

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

非官方测试版翻译

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

Canary 🧪

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

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

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

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


参考

实例属性

boundingClientRect

参阅 MDN 文档

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

intersectionRatio

参阅 MDN 文档

返回 intersectionRectboundingClientRect 的比值。

intersectionRect

参阅 MDN 文档

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

isIntersecting

参阅 MDN 文档

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

rnRootIntersectionRatio ⚠️

非标准

此为 React Native 特有的扩展。

返回 intersectionRectrootBounds 的比值。

ts
get rnRootIntersectionRatio(): number;

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

rootBounds

参阅 MDN 文档

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

target

参阅 MDN 文档

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

time

参阅 MDN 文档

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