交叉观察器API（Intersection Observer API）

提供了一种异步检测目标元素与祖先元素或顶级文档的[视口]相交情况变化的方法。

const observable = new IntersectionObserver(callback,options)

options：{
  root: '可视区域',
  rootMargin: "0px",
  threshold: 1.0,
}
callback:元素的可见性发生变化时，触发回调

callback((entrites:IntersectionObserverEntry[])=>{
//entrites的参数：
1.boundingClientRect:DOMRectReadOnly {x: 0, y: 323.1875, width: 16, height: 16, top: 323.1875, …} ,
2.intersectionRatio: 0
3.intersectionRect:DOMRectReadOnly {x: 0, y: 0, width: 0, height: 0, top: 0, …}
4.isIntersecting: false
5.isVisible: false
6.rootBounds:DOMRectReadOnly {x: 0, y: 0, width: 1440, height: 321, top: 0, …}
7.target: img.img
8.time: 282.89999997615814
})

vue的use
useIntersectionObserver