移动端react-hooks+TS上拉距离顶部一定距离时 改变页面样式

const stickyRef = useRef()   //创建一个ref

<div ref={
     stickyRef}></div>  //关联ref

const [sticky, setSticky] = useState(true);   //判断是否固定   通过sticky更换样式

const onScroll = () => {
     
  const top = stickyRef.current!.getBoundingClientRect()  //获取元素距离顶部的高度
  setStickyRef(top < 10 ? false : true)
}

注：getBoundingClientRect()用于获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置----------该函数返回一个Object对象，该对象有6个属性：top,lef,right,bottom,width,height